如何使用webpack加载库源地图?

JavaScript Webpack

GOJinJin

2020-03-24

我正在使用webpack构建两个项目;一个是另一个的库。

构建包装程序项目时,是否可以使用库项目中的源地图?我希望能够从包装器UI调试库代码。

我的构建可以正常运行,因为内置了该库。唯一的问题是源映射。我无法在浏览器调试器中看到JavaScript,因为源映射不可用。

我的项目结构的片段:

+-- my-ui/
    +-- dist/
        +-- my-ui.js
        +-- my-ui.js.map
    +-- node_modules/
        +-- my-lib/
            +-- dist/
                +-- bundle.js
                +-- bundle.js.map

摘录自webpack.config.js

module.exports = {
    entry: './src/js/main.jsx',
    output: {
        path: path.join(__dirname, 'dist'),
        filename: 'my-ui.js',
        library: 'my-ui',
        libraryTarget: 'umd'
    },
    devtool: 'source-map',
    module: {
        loaders: [
            {test: /\.jsx?$/, loader: 'babel', include: path.join(__dirname, 'src')}
        ]
    },
    plugins: [
        new Clean('dist'),
        new HtmlWebpackPlugin({
            template: 'src/index.html',
            inject: true
        })
    ]
};

第3642篇《如何使用webpack加载库源地图?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android