使用 VSCode 调试 Vue 项目

launch.json:

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8091/dist/#/",
            "webRoot": "${workspaceFolder}/src",
            "breakOnLoad": true,
            "sourceMapPathOverrides": {
                "webpack:///./*": "${webRoot}/*",
                "webpack:///src/*": "${webRoot}/*",
                "webpack:///*": "*",
                "webpack:///./~/*": "${webRoot}/node_modules/*",
                "meteor://app/*": "${webRoot}/*"
            }
        }
    ]
}

vue.config.js:

  publicPath: '/dist/',
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
    } else {
      // 为开发环境修改配置...
      config.devtool = 'source-map'
    }
  },
  productionSourceMap: true,  // 默认就是 true 可以不用设置
  devServer:{
    open: process.platform === 'darwin',
    host: '0.0.0.0',
    port: 8091,
    https: false,
    hotOnly: false,
  }

按 F5 启动 chrome 开始调试