无法设置未定义的属性'__UglifyJsPlugin'

时间:2016-08-12 16:37:07

标签: node.js webpack

我正在使用以下插件来对webpack中的uglify步骤进行并行化 https://github.com/tradingview/webpack-uglify-parallel

不幸的是,我收到以下错误: 致命错误:无法设置未定义的属性'__UglifyJsPlugin'

这是我的webpack配置:

/*jslint node: true */
var webpack = require("webpack"),
    _ = require("lodash"),
    path = require("path"),
    fs = require("fs"),
    os = require('os'),
    UglifyJsParallelPlugin = require('webpack-uglify-parallel'),
    webpackConfig,
    commonsPlugin = new webpack.optimize.CommonsChunkPlugin('m-common-[chunkhash:8].js'),
    dedupePlugin = new webpack.optimize.DedupePlugin(),
    uglifyPlugin = new webpack.optimize.UglifyJsPlugin({
        compress: {
            warnings: false
        }
    }),
    parallelUglify = new UglifyJsParallelPlugin({
        workers: os.cpus().length
    }),
    sourceMapPlugin = new webpack.SourceMapDevToolPlugin('[file].map', null,
                                                         '[absolute-resource-path]',
                                                         '[absolute-resource-path]'),

    fnCaseSensitivityPlugin = function () {
        this.plugin('normal-module-factory', function(nmf) {
            nmf.plugin('after-resolve', function(data, done) {
                var parentDir = path.dirname(data.resource);
                var resourceName = path.basename(data.resource);
                fs.readdir(parentDir, function(err, files) {
                    if (err) {
                        done(err);
                    }
                    if (files.indexOf(resourceName) === -1) {
                        var realName = _.find(files, function(filename) {
                            return filename.toLowerCase() === resourceName.toLowerCase();
                        });
                        done(new Error('CaseSensitivityPlugin: `' + resourceName + '` does not match the corresponding file on disk `' + realName + '`'));
                        return;
                    }
                    done(null, data);
                });
            });
        });
    },

    fnDonePlugin = function () {
        this.plugin("done", function(stats) {
            var statsByChunk = JSON.parse(JSON.stringify(stats.toJson())).assetsByChunkName;
            webpackConfig.statsByChunk = statsByChunk;

            for (var chunkName in statsByChunk) {
                if (statsByChunk.hasOwnProperty(chunkName)) {
                    var nameIn = statsByChunk[chunkName][0],
                        gzName = nameIn.substring(0, nameIn.length - 2) + "gz.js";
                    webpackConfig.filesToCompress['./marvel-web/dist/' + gzName] = './marvel-web/dist/' + nameIn;

                    // The mrvlBuildOut object contains a set of name/value
                    // pairs to be used during HTML template processing.
                    // There are certain filenames we need to add to the
                    // mrvlBuildOut object as properties so that they can be
                    // injected into HTML templates that make use of them.
                    // The code below takes the nameIn string which will have
                    // one of 2 forms:
                    //
                    //      Debug Builds:
                    //          m-core-fixed.js
                    //
                    //      Produciton Builds:
                    //          m-core-<chunkid>.js
                    //
                    // It strips off everything after the last dash including the
                    // .js extension so we are left with the base filename. We then
                    // use that filename base to look up the name of the property
                    // we should set to that filename on the mrvlBuildOut object.

                    var map = webpackConfig.mrvlBuildOutFilePropMap,
                        propName = map[nameIn.replace(/-[^-]+\.js$/ , '')];

                    if (propName) {
                        webpackConfig.mrvlBuildOut[propName] = nameIn;
                    }
                }
            }

            webpackConfig.webpackDoneListeners.forEach(function (fnCall) {
                fnCall(statsByChunk);
            });
        });
    };

webpackConfig = {

    mrvlBuildOut: {
        //gets filled in with m-common-[chunkhash] and m-web-[chunkhash]
    },

    mrvlBuildOutFilePropMap: {
        "m-common": "marvelcommon",
        "m-web":    "marvelweb",
        "m-blog":   "marvelblog",
        "m-gallery":   "marvelgallery",
        "m-landing":   "marvellanding",
        "m-unsupported": "marvelunsupported",
        "m-login":   "marvellogin",
        "m-voice-chrome":   "voicechrome",
        "m-apps-chrome":   "appschrome",
        "m-viewpage-chrome": "viewpagechrome"
    },

    webpackDoneListeners: [],
    filesToCompress: {
    },

    marvel: {
        addVendor: function (name, path, noparse) {
            this.resolve.alias[name] = path;
            if (noparse) {
                this.module.noParse.push(new RegExp(path));
            }
            this.entry.vendors.push(name);
        },

        addBuildOutFilePropMapEntry: function( filenameBase, propName ) {
            if ( filenameBase && propName ) {
                webpackConfig.mrvlBuildOutFilePropMap[filenameBase] = propName;
            }
        },

        stats: {
            colors: true,
            modules: true,
            reasons: false
        },
        entry: {
            'm-web': './marvel-web/js/app.js',
            'm-blog': './marvel-web/js/app-blog.js',
            'm-gallery': './marvel-web/js/app-gallery.js',
            'm-landing': './marvel-web/js/app-landing.js',
            'm-unsupported': './marvel-web/js/app-unsupported.js',
            'm-login': './marvel-web/js/app-login.js',
            'm-voice-chrome': './marvel-web/js/app-voice-chrome.js',
            'm-apps-chrome': './marvel-web/js/app-apps-chrome.js',
            'm-viewpage-chrome': './marvel-web/js/app-viewpage-chrome.js',
            vendors: []
        },
        resolve: {
            modulesDirectories: [
                'node_modules',
                'marvel-web',
                'marvel-web/js'
            ],
            alias: {
                // If you find yourself wanting to add an alias here, think
                // about if it would be better for your component to live in
                // marvel-core instead of in marvel-web. See the README.md in
                // marvel-core for more info.
                'marvel-apps': __dirname + '/marvel-web/js/apps.js',
                'uuid': 'node-uuid'
            }
        },
        output: {
            path: 'marvel-web/dist',
            filename: '[name]-[chunkhash:8].js',
            chunkFilename: '[name]-[chunkhash:8].js'
        },
        module: {
            noParse: [
                /[\/\\].html$/
            ]
        },
        plugins: [
            commonsPlugin,
            dedupePlugin,
            parallelUglify,
            fnCaseSensitivityPlugin,
            sourceMapPlugin,
            fnDonePlugin
        ]
    }
};

var libs_dir = __dirname + '/marvel-core/src/js/lib/';
webpackConfig.marvel.addVendor("jquery", libs_dir + "jQuery/jquery.min.js", true);
webpackConfig.marvel.addVendor("lodash", libs_dir + "lodash/lodash.min.js", true);
webpackConfig.marvel.addVendor("underscore", libs_dir + "lodash/lodash.min.js", true);
webpackConfig.marvel.addVendor("q", libs_dir + "q/q.js", true);
webpackConfig.marvel.addVendor("backbone", libs_dir + "backbone/backbone-min.js", false);//if we don't parse backbone then require is not found??
webpackConfig.marvel.addVendor("cookie", libs_dir + "cookie/cookie.js", true);
webpackConfig.marvel.addVendor("canvas-to-blob", libs_dir + "canvas-to-blob/canvas-to-blob.js", true);

webpackConfig.marvelDebug = {
    watch: true,
    keepAlive: true,
    stats: webpackConfig.marvel.stats,
    entry: webpackConfig.marvel.entry,
    resolve: webpackConfig.marvel.resolve,
    output: {
        path: 'marvel-web/dist',
        filename: '[name]-fixed.js',
        chunkFilename: '[name]-fixed.js'
    },
    module: webpackConfig.marvel.module,
    //devtool: "eval-source-map",
    devtool: "source-map",
    //devtool: "eval",
    addBuildOutFilePropMapEntry: webpackConfig.marvel.addBuildOutFilePropMapEntry,
    plugins: [
        commonsPlugin,
        dedupePlugin,
        fnCaseSensitivityPlugin,
        sourceMapPlugin,
        fnDonePlugin
    ]
};
webpackConfig.marvelDebug.output.pathinfo = true;

module.exports = webpackConfig;

1 个答案:

答案 0 :(得分:0)

当我没有为原始的UglifyJsPlugin添加单独的条目时,该插件适用于我的项目。尝试删除它并将其配置添加到UglifyJsParallelPlugin。