ОШИБКА от плагина UglifyJs Webpack - Неожиданный токен: имя (расширяется) - PullRequest
Новая
       19

ОШИБКА от плагина UglifyJs Webpack - Неожиданный токен: имя (расширяется)

0 голосов
/ 21 января 2019

Я пытаюсь минимизировать свой проект с помощью Uglifyjs, но я получаю сообщение об ошибке Неожиданный токен: имя (расширяется).Кажется, проблема связана с транспиляцией, но я уже использую babel для этого.Для справки, вы можете получить доступ к проекту с воспроизведенной ошибкой из моего репозитория .В противном случае, здесь также есть фрагмент моей конфигурации веб-пакета и мой файл .babelrc: 

const webpack = require('webpack');
const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const WorkboxPlugin = require('workbox-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); 

const webcomponentsjs = './node_modules/@webcomponents/webcomponentsjs';

const polyfills = [
    //Webcomponents polyfill applied in the index.html
    {
        from: path.resolve(`${webcomponentsjs}/webcomponents-*.{js,map}`),
        to: path.join(__dirname, 'wwwroot'),
        flatten: true
    },

        {
            from: path.resolve(`${webcomponentsjs}/custom-elements-es5-adapter.js`),
            to: path.join(__dirname, 'wwwroot'),
            flatten: true
        },
];

module.exports = function (env) {
    return {
        mode: 'development',
        devtool: 'inline-source-map',
        entry: './src/index.js',
        output: {
            publicPath: '/',
            path: path.resolve(__dirname, 'wwwroot'),
            filename: "[name].[contenthash].js",  
            chunkFilename: '[name].[contenthash].js',
        },

        optimization: {
            splitChunks: {
                cacheGroups: {
                    vendor: {
                       test: /[\\/]node_modules[\\/]/,
                       name: 'vendors',
                       chunks: 'all'
                    }
                }
            },
            runtimeChunk: 'single',
            minimize: true,
            minimizer: [
                 new UglifyJsPlugin()
             ],
             usedExports: true,
             sideEffects: false
        },

        module: {
            rules: [
                {
                    test: /\.js$/,
                   //exclude: /node_modules/,
                    use: {
                        loader: 'babel-loader',  
                    }
                },
                {
                    "test": /\.html$/,
                    "use": [{
                        loader: 'html-loader',
                    }]
                }
            ]
        },

        resolve: {
            modules: [
                "node_modules",
                path.resolve(__dirname, "src")
            ],
            extensions: [".js", ".json"],
        },

        plugins: [
            new webpack.HashedModuleIdsPlugin(),
            new HtmlWebpackPlugin({
                template: 'src/index.html'}),
            new CleanWebpackPlugin(['wwwroot']),
            new CopyWebpackPlugin([...polyfills]),
        ],

    }
};

А вот мой файл .babelrc: 

{
    "presets": [
        [
        "@babel/preset-env",
        {
            "targets": {
            "browsers": [ "last 2 versions", "ie >= 11" ]
            },
            "exclude": [ "transform-classes" ]
        }
        ]
    ],
    "plugins": [
        "@babel/plugin-proposal-class-properties",
        "@babel/plugin-proposal-object-rest-spread",
        "@babel/plugin-syntax-dynamic-import"
    ]
}

1 Ответ

0 голосов
/ 23 января 2019

Ну, мне не удалось исправить UglifyJS, но альтернативным решением было переключиться на Terser для минимизации, которая в соответствии с их документацией , в любом случае используется Webpack по умолчанию. Ссылка на мой репозиторий, который я разместил в этом вопросе, превратилась в стандартный код Polymer 3 Webpack. Если кто-то узнает, в чем проблема с UglifyJS, это все равно будет более правильным ответом.

...