gdborton / webpack-parallel-uglify-plugin

A faster uglifyjs plugin.
466 stars 34 forks source link

webpack-parallel-uglify-plugin cannot uglify any file #37

Closed zhaosaisai closed 6 years ago

zhaosaisai commented 7 years ago

when i use new webpack.optimize.UglifyJsPlugin, the file is uglified as normal. but when i change to the webpack-parallel-uglify-plugin with the same uglify config. the result is that the is no file uglified.

my webpack.config.js as below, you can see the target config at the bottom

/* eslint-env node */
/* eslint-disable import/no-commonjs */
require("babel-register");
require("babel-polyfill");

var webpack = require('webpack');
var path = require('path');
var webpackPostcssTools = require('webpack-postcss-tools');

var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin');
var UnusedFilesWebpackPlugin = require("unused-files-webpack-plugin").default;
var BannerWebpackPlugin = require('banner-webpack-plugin');
var AddAssetHtmlPlugin = require('add-asset-html-webpack-plugin');
var HappyPack = require('happypack');
var ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin');

var _ = require('underscore');
var glob = require('glob');
var fs = require('fs');

var chevrotain = require("chevrotain");
var allTokens = require("./frontend/src/metabase/lib/expressions/tokens").allTokens;

function hasArg(arg) {
    var regex = new RegExp("^" + ((arg.length === 2) ? ("-\\w*"+arg[1]+"\\w*") : (arg)) + "$");
    return process.argv.filter(regex.test.bind(regex)).length > 0;
}

var SRC_PATH = __dirname + '/frontend/src/metabase';
var BUILD_PATH = __dirname + '/resources/frontend_client';

// default NODE_ENV to development
var NODE_ENV = process.env["NODE_ENV"] || "development";

// Need to scan the CSS files for variable and custom media used across files
// NOTE: this requires "webpack -w" (watch mode) to be restarted when variables change :(
var IS_WATCHING = hasArg("-w") || hasArg("--watch");
if (IS_WATCHING) {
    process.stderr.write("Warning: in webpack watch mode you must restart webpack if you change any CSS variables or custom media queries\n");
}

// Babel:
var BABEL_CONFIG = {
    cacheDirectory: ".babel_cache"
};

// Build mapping of CSS variables
var CSS_SRC = glob.sync(SRC_PATH + '/css/**/*.css');
var CSS_MAPS = { vars: {}, media: {}, selector: {} };
CSS_SRC.map(webpackPostcssTools.makeVarMap).forEach(function(map) {
    for (var name in CSS_MAPS) _.extend(CSS_MAPS[name], map[name]);
});

// CSS Next:
var CSSNEXT_CONFIG = {
    features: {
        // pass in the variables and custom media we scanned for before
        customProperties: { variables: CSS_MAPS.vars },
        customMedia: { extensions: CSS_MAPS.media }
    },
    import: {
        path: ['resources/frontend_client/app/css']
    },
    compress: false
};

var CSS_CONFIG = {
    localIdentName: NODE_ENV !== "production" ?
        "[name]__[local]___[hash:base64:5]" :
        "[hash:base64:5]",
    restructuring: false,
    compatibility: true,
    url: false, // disabled because we need to use relative url()
    importLoaders: 1
}

// happypack.config
var happyPackConfig = {
    plugins:[
        new HappyPack({
           id: 'happyBabel',
           threads: 4,
           cache: true,
           loaders:[
               {
                   path: 'babel',
                   query: BABEL_CONFIG
               }
           ]
        }),
        new HappyPack({
            id: 'happyEslint',
            threads: 4,
            cache: true,
            loaders: ['eslint']
        })
    ]
}

var config = module.exports = {
    context: SRC_PATH,

    // output a bundle for the app JS and a bundle for styles
    // eventually we should have multiple (single file) entry points for various pieces of the app to enable code splitting
    entry: {
        "app-main": './app-main.js',
        "app-public": './app-public.js',
        "app-embed": './app-embed.js',
        styles: './css/index.css',
    },

    // output to "dist"
    output: {
        path: BUILD_PATH + '/app/dist',
        // NOTE: the filename on disk won't include "?[chunkhash]" but the URL in index.html generated by HtmlWebpackPlugin will:
        filename: '[name].bundle.js?[hash]',
        publicPath: 'app/dist/'
    },

    module: {
        loaders: [
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules/,
                // loader: "babel",
                // query: BABEL_CONFIG
                loader: `${path.resolve(__dirname, './node_modules', 'happypack/loader')}?id=happyBabel`
            },
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules|\.spec\.js/,
                // loader: 'eslint'
                loader: `${path.resolve(__dirname, './node_modules', 'happypack/loader')}?id=happyEslint`
            },
            {
                test: /\.(eot|woff2?|ttf|svg|png)$/,
                loader: "file-loader"
            },
            {
                test: /\.json$/,
                loader: "json-loader"
            },
            {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader?" + JSON.stringify(CSS_CONFIG) + "!postcss-loader")
            }
        ]
    },

    resolve: {
        extensions: ["", ".webpack.js", ".web.js", ".js", ".jsx", ".css"],
        alias: {
            'metabase':             SRC_PATH,
            'style':                SRC_PATH + '/css/core/index.css',
            'ace':                  __dirname + '/node_modules/ace-builds/src-min-noconflict',
            'resource':             __dirname + '/resources'
        }
    },

    plugins: [
        new UnusedFilesWebpackPlugin({
            globOptions: {
                ignore: [
                    "**/types/*.js",
                    "**/*.spec.*",
                    "**/__support__/*.js"
                ]
            }
        }),
        new webpack.DllReferencePlugin({
            context: __dirname,
            manifest: require('./manifest.json'),
            name:"vendors_dll"
        }),
        // Extracts initial CSS into a standard stylesheet that can be loaded in parallel with JavaScript
        // NOTE: the filename on disk won't include "?[chunkhash]" but the URL in index.html generated by HtmlWebpackPlugin will:
        new ExtractTextPlugin('[name].bundle.css?[contenthash]'),
        new HtmlWebpackPlugin({
            filename: '../../index.html',
            chunks: ["app-main", "styles"],
            template: __dirname + '/resources/frontend_client/index_template.html',
            inject: 'head',
            alwaysWriteToDisk: true,
        }),
        new HtmlWebpackPlugin({
            filename: '../../public.html',
            chunks: ["app-public", "styles"],
            template: __dirname + '/resources/frontend_client/index_template.html',
            inject: 'head',
            alwaysWriteToDisk: true,
        }),
        new HtmlWebpackPlugin({
            filename: '../../embed.html',
            chunks: ["app-embed", "styles"],
            template: __dirname + '/resources/frontend_client/index_template.html',
            inject: 'head',
            alwaysWriteToDisk: true,
        }),
        new AddAssetHtmlPlugin({
            filepath: BUILD_PATH + '/app/dist/*.dll.js',
            includeSourcemap: false
        }),
        new HtmlWebpackHarddiskPlugin({
            outputPath: __dirname + '/resources/frontend_client/app/dist'
        }),
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: JSON.stringify(NODE_ENV)
            }
        }),
        new BannerWebpackPlugin({
            chunks: {
                'app-main': {
                    beforeContent: "/*\n* This file is subject to the terms and conditions defined in\n * file 'LICENSE.txt', which is part of this source code package.\n */\n",
                },
                'app-public': {
                    beforeContent: "/*\n* This file is subject to the terms and conditions defined in\n * file 'LICENSE.txt', which is part of this source code package.\n */\n",
                },
                'app-embed': {
                    beforeContent: "/*\n* This file is subject to the terms and conditions defined in\n * file 'LICENSE-EMBEDDING.txt', which is part of this source code package.\n */\n",
                },
            }
        }),
    ].concat(happyPackConfig.plugins),

    postcss: function (webpack) {
        return [
            require("postcss-import")(),
            require("postcss-url")(),
            require("postcss-cssnext")(CSSNEXT_CONFIG)
        ]
    }
};

if (NODE_ENV === "hot") {
    // suffixing with ".hot" allows us to run both `yarn run build-hot` and `yarn run test` or `yarn run test-watch` simultaneously
    config.output.filename = "[name].hot.bundle.js?[hash]";

    // point the publicPath (inlined in index.html by HtmlWebpackPlugin) to the hot-reloading server
    config.output.publicPath = "http://localhost:8080/" + config.output.publicPath;

    config.module.loaders.unshift({
        test: /\.jsx$/,
        exclude: /node_modules/,
        loaders: ['react-hot', 'babel?'+JSON.stringify(BABEL_CONFIG)]
    });

    // disable ExtractTextPlugin
    config.module.loaders[config.module.loaders.length - 1].loader = "style-loader!css-loader?" + JSON.stringify(CSS_CONFIG) + "!postcss-loader"

    config.devServer = {
        hot: true,
        inline: true,
        contentBase: "frontend"
        // if webpack doesn't reload UI after code change in development
        // watchOptions: {
        //     aggregateTimeout: 300,
        //     poll: 1000
        // }
        // if you want to reduce stats noise
        // stats: 'minimal' // values: none, errors-only, minimal, normal, verbose
    };

    config.plugins.unshift(
        new webpack.NoErrorsPlugin(),
        new webpack.HotModuleReplacementPlugin()
    );
}

if (NODE_ENV !== "production") {
    // replace minified files with un-minified versions
    for (var name in config.resolve.alias) {
        var minified = config.resolve.alias[name];
        var unminified = minified.replace(/[.-\/]min\b/g, '');
        if (minified !== unminified && fs.existsSync(unminified)) {
            config.resolve.alias[name] = unminified;
        }
    }

    // enable "cheap" source maps in hot or watch mode since re-build speed overhead is < 1 second
    config.devtool = "cheap-module-source-map";

    // works with breakpoints
    // config.devtool = "inline-source-map"

    // helps with source maps
    config.output.devtoolModuleFilenameTemplate = '[absolute-resource-path]';
    config.output.pathinfo = true;
} else {
    // config.plugins.push(new webpack.optimize.UglifyJsPlugin({
    //     // suppress uglify warnings in production
    //     // output from these warnings was causing Heroku builds to fail (#5410)
    //     compress: {
    //         warnings: false,
    //     },
    //     output: {
    //         comments: false,
    //     },
    //     mangle: {
    //         // this is required to ensure we don't minify Chevrotain token identifiers
    //         // https://github.com/SAP/chevrotain/tree/master/examples/parser/minification
    //         except: allTokens.map(function(currTok) {
    //             return chevrotain.tokenName(currTok);
    //         })
    //     }
    // }))

    config.plugins.push(new ParallelUglifyPlugin({
        cacheDir: '.js_cache/',
        uglifyJS:{
            output: {
                comments: false,
            },
            compress: {
                warnings: false,
            },
            mangle: {
                // this is required to ensure we don't minify Chevrotain token identifiers
                // https://github.com/SAP/chevrotain/tree/master/examples/parser/minification
                except: allTokens.map(function(currTok) {
                    return chevrotain.tokenName(currTok);
                })
            }
        }
    }))

    config.devtool = "source-map";
}
zhaosaisai commented 7 years ago

And my computer version MAC OSX 10.11.1, the command to run the webpackis:

NODE_ENV=production webpack --bail --progress
gdborton commented 7 years ago

@pavoooo is there no error output associated with this? The most typical case that I've seen when there is a failure to minify is that you have es6 somewhere in your output that hasn't been run through babel. This should be failing a build run with --bail though.

If you have a repository that recreates the issue, that'd be extremely helpful.

gdborton commented 6 years ago

@2json Looks like you changed your username, so you may not have seen my previous comment.

saysmy commented 6 years ago

I've met the question as you too. No errors were printed. I want to know how to solve it

gdborton commented 6 years ago

I'm closing this out due to inactivity from the original issuer. If you're having problems with this plugin, please submit a new issue, ideally with a repo that showcases the problem.