typescript - Webpack 中 Typescript 的源映射(使用 webpack-dev-server 时看不到源映射)

标签 typescript webpack source-maps webpack-dev-server

我正在尝试将 Typescript (awesome-typescript-loader ( link )) 与 Webpack 一起使用,但在运行 webpack-dev 时我没有在浏览器中看到源映射-服务器。相同的设置适用于 babel-loader ( link ) 和 ES6 类(我可以在浏览器中调试 ES6 类,即使它们被编译为 ES5)

我的 Webpack 配置文件看起来像(这是重要的片段,完整版在 github 上):

module.exports = {
    resolve: {
        extensions: ['', '.ts', '.js']
    },
    entry: {
        app: './src/app.ts'
    },
    output: {
        path: params.output.path,
        filename: params.output.filename
    },
    module: {
        loaders: [
            {test: /\.ts$/, loader: 'awesome-typescript', exclude: /node_modules/},
            {test: /\.css$/, loader: 'style!css'}
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: './src/index.html',
            inject: 'body'
        })
    ].concat(params.plugins),
    progress: true,
    colors: true,
    devServer: {
        port: params.server.port
    }
};

最佳答案

我发现了问题,我提取了 devtooldebug 属性作为参数,但我忘记再次阅读它们以形成最终配置。最终的工作版本如下所示:

// ...
debug: params.debug,
devtool: params.devtool,
// ...

关于typescript - Webpack 中 Typescript 的源映射(使用 webpack-dev-server 时看不到源映射),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31974302/

相关文章:

javascript - 使用 webpack 获取 ractive 模块中的缩小版本

node.js - node --enable-source-maps 不输出函数名

reactjs - Instana 与 create-react-app 集成以下载源映射以进行错误报告

javascript - typescript 类型的动态类方法

javascript - TypeScript 中 React.Component 的继承

vue.js - "": expected 1 selector or at-rule, 之后的无效 CSS 是 "{"

webpack - Web3 formatter.js 加载问题

javascript - 源映射错误 : Error: request failed with status 404 Resource URL: https://cdn. jsdelivr.net/npm/@barba/core@2.9.7 源映射 URL : barba. umd.js.map

Angular2 对预检请求的响应未通过访问控制检查 : No 'Access-Control-Allow-Origin' header is present on the requested resource

Angular2从Odata Controller 获取数据