Vue 3 / Webpack 5 尝试丑化我的包时出现问题

问题描述

我目前正在使用 Vue 3 和 Webpack 建立一个项目。 我在 webpack 中的开发配置现在按我们的预期工作,但是当我在使用 uglify 插件的同时尝试移动到我的 prod 时,我收到了这个错误Webpack Error at Prod Config While Using Uglify

我对此很困惑,我不确定我是否在遵循文档时在配置上犯了错误,或者 Webpack 5 不支持 Uglify。

这是我的 Prod 配置。

/*globals exports*/ // < EsLint exceptions
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const { LoaderOptionsPlugin,SourceMapDevToolPlugin } = require('webpack');
const BASE = require('./base.js');
const ID = 'production';

exports.isIt = NODE_ENV => NODE_ENV === ID;

/**
 * @pure true
 * @side_effect false
 * @return {object} webpack module config in mode production
 */
exports.generateData = () => {
    let processedConfig = BASE.generateData(ID);
    processedConfig.mode = ID;
  
    processedConfig.plugins.push(
        new LoaderOptionsPlugin({ minimize: true,debug: false })
    );

    //Generate external sourceMap
    processedConfig.devtool = false;

    processedConfig.plugins.push(
        new SourceMapDevToolPlugin({
            filename: 'production-js.js.map'
        })
    );

    processedConfig.optimization = {
        /* runtimeChunk: 'single',splitChunks: {
            cacheGroups: {
            vendor: {
                test: /[\\/]node_modules[\\/]/,name: 'vendors',priority: -10,chunks: 'all',},*/
        moduleIds: 'deterministic',minimizer: [
            new UglifyJsPlugin({
                cache: false,parallel: true,uglifyOptions: {
                    output: {
                        comments: false,beautify: false,compress: {
                        dead_code: true,drop_console: true,drop_debugger: true,ecma: 5,mangle: true,sourceMap: true,}),],};
    return processedConfig;
};

有人在尝试做类似的事情时遇到过同样的问题吗? 提前致谢!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)