Component .vue.s sourcemap file not generating

Question

This is my first time giving Vue a spin. I used the Vue command line tool to generate the sample project with typescript. I set "sourceMap": true in the tsconfig.js. When running serve it does generate JavaScript source map for *.ts files. But the *.vue component, it does not generate a .js source map. There's no warnings or errors in the command line output. I want the JavaScript source maps of *.vue so WebStorm can hit breakpoints.

I initially didn't have "sourceMap": true in tsconfig.js. I verified the *.ts is generating .js source maps. Also I verified for those *.ts files WebStorm can now hit breakpoints. Breakpoints are not being hit in *.vue Components. I fixed all warnings in the code I modified.

snippet from tsconfig.js

"compilerOptions": {
"sourceMap": true,
"inlineSources":  true,
"types": [
  "webpack-env",
  "jest"
],

"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx",
"src/components/HelloWorld.vue" //<-- just to see if it made a difference 
]

part of the packages.json:

"typescript": "^3.0.0",
"vue-template-compiler": "^2.5.21"
"@vue/cli-service": "^3.2.0",

I'm expecting a .js file is generated for all .vue that have typescript in them. Js files are generated for .ts files but not for .vue files.

lena · Accepted Answer · 2019-01-26 12:13:06Z

1

Source maps for .vue files (as well as for .ts files) are generated by vue cli on-the-fly when running vue-cli-service serve, but they are not flushed to disk so you can't see them. WebStorm can't currently debug .vue files in Typescript + Vue.js projects because of the way .vue files are mapped to resultant bundle. We are investigating possible solutions for this issue, please follow WEB-34557 for updates

answered Jan 26, 2019 at 12:13

lena

94.4k11 gold badges155 silver badges160 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sean Over a year ago

here's the issue on vue cli project: github.com/vuejs/vue-cli/issues/2897

Sean Over a year ago

someone from the vue-cli chat responded this morning and put a work around on that github issue from the context of VS Code. How can a similar work around be applied with WebStorm?

lena Over a year ago

please see my comment in youtrack ticket (youtrack.jetbrains.com/issue/…) - for me, this workaround works neither in VSCode nor in WebStorm

Collectives™ on Stack Overflow

Component .vue.s sourcemap file not generating

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related