vuejs/vue-cli

Vue CLI sourcemaps to style part of vue component file

Open

Aperta il 20 mag 2019

Vedi su GitHub
 (6 commenti) (1 reazione) (0 assegnatari)JavaScript (29.754 star) (6328 fork)batch import
bughelp wanted

Descrizione

Version

3.7.0

Reproduction link

https://github.com/l00k/vue-sample

Environment info

Environment Info:

  System:
    OS: Linux 4.15 Linux Mint 19 (Tara)
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
  Binaries:
    Node: 8.15.0 - ~/.nvm/versions/node/v8.15.0/bin/node
    Yarn: Not Found
    npm: 6.4.1 - ~/.nvm/versions/node/v8.15.0/bin/npm
  Browsers:
    Chrome: 73.0.3683.103
    Firefox: 66.0.2
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0 
    @vue/babel-plugin-transform-vue-jsx:  1.0.0 
    @vue/babel-preset-app:  3.7.0 
    @vue/babel-preset-jsx:  1.0.0 
    @vue/babel-sugar-functional-vue:  1.0.0 
    @vue/babel-sugar-inject-h:  1.0.0 
    @vue/babel-sugar-v-model:  1.0.0 
    @vue/babel-sugar-v-on:  1.0.0 
    @vue/cli-overlay:  3.7.0 
    @vue/cli-plugin-babel: ^3.7.0 => 3.7.0 
    @vue/cli-plugin-pwa: ^3.7.0 => 3.7.0 
    @vue/cli-service: ^3.7.0 => 3.7.0 
    @vue/cli-shared-utils:  3.7.0 
    @vue/component-compiler-utils:  2.6.0 
    @vue/preload-webpack-plugin:  1.1.0 
    @vue/web-component-wrapper:  1.2.0 
    vue: ^2.6.10 => 2.6.10 
    vue-hot-reload-api:  2.3.3 
    vue-loader:  15.7.0 
    vue-router: ^3.0.3 => 3.0.6 
    vue-style-loader:  4.1.2 
    vue-template-compiler: ^2.5.21 => 2.6.10 
    vue-template-es2015-compiler:  1.9.1 
    vuex: ^3.0.1 => 3.1.1 
  npmGlobalPackages:
    @vue/cli: 3.7.0

Steps to reproduce

  1. Make sure you include my config vue.config.js (to enable sourcemaps)
  2. npm run serve
  3. Create filesystem mount (chrome)
  4. Open browser devtools and inspect any link
  5. Check styles subtab to track where style is defined, click on link to source tab

What is expected?

Sourcemap should point to full file component with edit available (as filesystem mount done)

What is actually happening?

Source tab presents only few lines with SCSS code (only style tag content). Edit is not available.


If you remove attribute lang="scss" full source of vue file will be presented, but still without option to edit file (via filesystem mount) I also created question with bounty on SO https://stackoverflow.com/questions/56127998/vue-cli-sourcemaps-to-style-part-of-vue-component-file

Guida contributor