无法将VS Code与Vagrant,Webpack,Typescript和NodeJS + Express结合使用

时间:2019-10-16 01:00:56

标签: typescript debugging webpack visual-studio-code vagrant

我正在尝试使用VSCode,NodeJS + Express,Vagrant VM,Webpack和Typescript设置调试

我在launch.json中有这个

{
            "type": "node",
            "request": "attach",
            "name": "Vagrant",
            "address": "127.0.0.1",
            "port": 9229,
            "restart": true,
            "sourceMaps": true,
            "localRoot": "${workspaceFolder}",
            "remoteRoot": "/vagrant",
            "outFiles": ["${workspaceFolder}/**/dist/*.js"],
}

我已经将其添加到Vagrantfile

config.vm.network "forwarded_port", guest:9229, host: 9229, host_ip: "127.0.0.1"

我已经在webpack.config.js中添加了devtoolModuleFilenameTemplate和devtool

{
    mode: 'development',
    name: 'app',
    target: 'node',
    entry: {
        app: './src/app.ts'
    },
    resolve: {
        extensions: ['.ts', '.js'],
        plugins: [new TsconfigPathsPlugin({})],
    },
    output:  {
        path: __dirname + '/dist',
        filename: '[name].js',
        devtoolModuleFilenameTemplate: '[absolute-resource-path]',
    },
    devtool: 'cheap-source-map',
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: 'ts-loader',
                exclude: /node_modules/
            },
        ]
    }
}

我已经在tsconfig.json中启用了sourceMap

{
  "compilerOptions": {
    "baseUrl": "./src",
    "sourceMap": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target" : "ES2018",
  },
}

因此,我在流浪汉中使用webpack对其进行了构建,并且相应地在dist文件夹中生成了app.js和app.js.map文件。因此,我运行"node --inspect=0.0.0.0:9229 dist/app.js"并开始vscode调试。调试器似乎正确地附加到了流浪者实例,但是当我在app.ts中创建断点时,VS Code却抱怨道:“断点被忽略,因为未找到生成的代码(源映射问题?)”。触发应执行app.ts(即Express应用程序)的端点也不会在断点处停止。我在做什么错了?

0 个答案:

没有答案