vuejs / vue-cli

🛠️ webpack-based tooling for Vue.js Development
https://cli.vuejs.org/
MIT License
29.76k stars 6.33k forks source link

Dist paths for chrome extension project #5401

Open haron-IV opened 4 years ago

haron-IV commented 4 years ago

Version

4.3.1

Reproduction link

https://ivenot.com

Environment info

  System:
    OS: macOS Mojave 10.14.6
    CPU: (8) x64 Intel(R) Core(TM) i7-3720QM CPU @ 2.60GHz
  Binaries:
    Node: 13.11.0 - ~/.nvm/versions/node/v13.11.0/bin/node
    Yarn: 1.22.0 - /usr/local/bin/yarn
    npm: 6.13.7 - ~/.nvm/versions/node/v13.11.0/bin/npm
  Browsers:
    Chrome: 80.0.3987.163
    Firefox: Not Found
    Safari: 12.1.2
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0 
    @vue/babel-plugin-transform-vue-jsx:  1.1.2 
    @vue/babel-preset-app:  4.3.1 
    @vue/babel-preset-jsx:  1.1.2 
    @vue/babel-sugar-functional-vue:  1.1.2 
    @vue/babel-sugar-inject-h:  1.1.2 
    @vue/babel-sugar-v-model:  1.1.2 
    @vue/babel-sugar-v-on:  1.1.2 
    @vue/cli-overlay:  4.3.1 
    @vue/cli-plugin-babel: ~4.3.0 => 4.3.1 
    @vue/cli-plugin-router: ~4.3.0 => 4.3.1 
    @vue/cli-plugin-vuex: ~4.3.0 => 4.3.1 
    @vue/cli-service: ~4.3.0 => 4.3.1 
    @vue/cli-shared-utils:  4.3.1 
    @vue/component-compiler-utils:  3.1.2 
    @vue/preload-webpack-plugin:  1.1.1 
    @vue/web-component-wrapper:  1.2.0 
    vue: ^2.6.11 => 2.6.11 
    vue-cli-plugin-vuetify: ~2.0.5 => 2.0.5 
    vue-hot-reload-api:  2.3.4 
    vue-loader:  15.9.1 
    vue-router: ^3.1.6 => 3.1.6 
    vue-style-loader:  4.1.2 
    vue-template-compiler: ^2.6.11 => 2.6.11 
    vue-template-es2015-compiler:  1.9.1 
    vuetify: ^2.2.11 => 2.2.22 
    vuetify-loader: ^1.3.0 => 1.4.3 
    vuex: ^3.1.3 => 3.1.3 
  npmGlobalPackages:
    @vue/cli: 4.3.1

Steps to reproduce

System: OS: macOS Mojave 10.14.6 CPU: (8) x64 Intel(R) Core(TM) i7-3720QM CPU @ 2.60GHz Binaries: Node: 13.11.0 - ~/.nvm/versions/node/v13.11.0/bin/node Yarn: 1.22.0 - /usr/local/bin/yarn npm: 6.13.7 - ~/.nvm/versions/node/v13.11.0/bin/npm Browsers: Chrome: 80.0.3987.163 Firefox: Not Found Safari: 12.1.2 npmPackages: @vue/babel-helper-vue-jsx-merge-props: 1.0.0 @vue/babel-plugin-transform-vue-jsx: 1.1.2 @vue/babel-preset-app: 4.3.1 @vue/babel-preset-jsx: 1.1.2 @vue/babel-sugar-functional-vue: 1.1.2 @vue/babel-sugar-inject-h: 1.1.2 @vue/babel-sugar-v-model: 1.1.2 @vue/babel-sugar-v-on: 1.1.2 @vue/cli-overlay: 4.3.1 @vue/cli-plugin-babel: ~4.3.0 => 4.3.1 @vue/cli-plugin-router: ~4.3.0 => 4.3.1 @vue/cli-plugin-vuex: ~4.3.0 => 4.3.1 @vue/cli-service: ~4.3.0 => 4.3.1 @vue/cli-shared-utils: 4.3.1 @vue/component-compiler-utils: 3.1.2 @vue/preload-webpack-plugin: 1.1.1 @vue/web-component-wrapper: 1.2.0 vue: ^2.6.11 => 2.6.11 vue-cli-plugin-vuetify: ~2.0.5 => 2.0.5 vue-hot-reload-api: 2.3.4 vue-loader: 15.9.1 vue-router: ^3.1.6 => 3.1.6 vue-style-loader: 4.1.2 vue-template-compiler: ^2.6.11 => 2.6.11 vue-template-es2015-compiler: 1.9.1 vuetify: ^2.2.11 => 2.2.22 vuetify-loader: ^1.3.0 => 1.4.3 vuex: ^3.1.3 => 3.1.3 npmGlobalPackages: @vue/cli: 4.3.1

What is expected?

What is actually happening?


Hi. I'm working on chrome extension based on vue (cli) vuetify. Everything are good without small thing - dist paths. Chrome extension popup use /dist/index.html and I need set dot before each path for link sources. What this mean? I've script in my dist index.html: But path should have dot before like this for working:

haron-IV commented 4 years ago

For now I fixed it with small node script `var fs = require('fs');

fs.readFile('./dist/index.html', 'utf8', function (err, data){ if (err) { return console.log(err); }

var result = data;

result = result.replace(/src=\//g, 'src=./');
result = result.replace(/href=\//g, 'src=./');

fs.writeFile('./dist/index.html', result, 'utf8', function(err) {
    if (err) return console.log(err);
})

})`