3

我想要的是？

使用TerserPlugin将 sourceMapsomething.js.map文件存储到特定位置。我找到了一些关于如何自定义缩小的基本说明 - https://github.com/webpack-contrib/terser-webpack-plugin#custom-minify-function，但我无法使用它。

这是来自 webpack.config.ts 的优化对象：

optimization: {
  splitChunks: ifProduction({
    chunks: 'all',
    automaticNameDelimiter: '.'
  }, false),
  runtimeChunk: ifProduction(true, false),
  minimize: true,
  minimizer: [
    ifProduction(new TerserPlugin({
      parallel: true,
      sourceMap: true,
      minify: 'see value below -->>',
      terserOptions: {
        output: {
          ascii_only: true,
          beautify: false
        },
        compress: {
          pure_getters: true,
          join_vars: false
        }
      }
    }))
  ]
}

这是我的缩小功能，但我根本找不到“导出”.js.map 的方法。或者不明白它是如何工作的。

minify: (file, sourceMap) => {
    // https://github.com/mishoo/UglifyJS2#minify-options
    const uglifyJsOptions: any = {
        /* your `uglify-js` package options */
    };

    if (sourceMap) {
        uglifyJsOptions.sourceMap = {
            content: sourceMap,
            root: "http://localhost:7000",
            url: "out.js.map"
        };
    }

    return require('uglify-js').minify(file, uglifyJsOptions);
}

devtool: ifNotTest(ifDevelopment('eval', 'source-map'))

我花了两天时间试图弄清楚 minify 函数是如何工作的，并质疑自己为什么它们仍然引用uglify-js. 我认为 terser 可以有一些选项来自定义 sourceMap，但是 webpack 的文档对于这种情况并没有多大用处： https ://webpack.js.org/plugins/terser-webpack-plugin/#minify

4

1 回答 1

0

您可以使用 webpack 输出设置“sourceMapFilename”来指定源映射文件名和位置。

https://webpack.js.org/configuration/output/#outputsourcemapfilename

例子：

        output: {
           filename: 'assets/js/[name].[chunkhash].js',
           chunkFilename: 'assets/js/[name].[chunkhash].js',
           path: path.resolve(__dirname, 'dist'),
           sourceMapFilename: 'assets/js/maps/[name].[chunkhash].js.map'
        }
于 2020-09-08T22:02:13.690 回答