The vscode+debugger for chrome plug-in develops the mobile web program based on vux, and the debugging breakpoints are not matched.

problem description

The

vscode+debugger for chrome plug-in develops vux-based mobile web programs, and
adds breakpoints in vue. When executed, the breakpoints do not match, and debugging sometimes stops where the breakpoints are not set.

another program developed based on the webpack template can be debugged normally.

the environmental background of the problems and what methods you have tried

vscode 1.27.2 English version
Debugger for Chrome 4.10.1
win10 Chinese version
node v8.11.2
npm 5.6.0
vue 2.9.6
vux 2.9.2

related codes

1. Use the following steps to create a project

npm install vue-cli -g 
vue init airyland/vux2 projectPath

cd projectPath
npm install --registry=https://registry.npm.taobao.org
npm run dev 

2. The development tool uses the vscode 1.27.2 + debugger for chrome plug-in

3. Debug configuration parameters are as follows
.vscode / launch.json:

{

    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8088/hotel",
            "webRoot": "${workspaceFolder}"  // ${workspaceFolder}/src  
        }
    ]
}

some of the configurations in config/index.js are as follows

    devtool: "eval-source-map", //  source-map 
    cacheBusting: false,
    cssSourceMap: true

what result do you expect? What is the error message actually seen?

I hope to debug normally and stay at the breakpoint.


Sourcemap is not perfect. Today, with the popularity of Bundler and Compiler, Sourcemap is becoming more and more powerless.

Menu