为什么 Webpack 中没有设置环境

Question

我有 webpack 4.17.1 在开发环境中使用我的 SPA。

现在我想为生产打包。

在 Visual Studio 任务运行器中使用此命令启动：

 C:\Dev\Traken.app\Traken.5\Dev\Traken\Traken> cmd /c SET NODE_ENV=production&& webpack --color

但是，WebPack 似乎没有拾取环境，因为此命令返回 undefined

console.log("mode=", argv.mode);

这是 webpack.config.js：

const path = require("path");
const webpack = require("webpack");
const { AureliaPlugin, ModuleDependenciesPlugin, GlobDependenciesPlugin } = require("aurelia-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");

const extractCSS = new ExtractTextPlugin("vendor.css");
const bundleOutputDir = "./wwwroot/dist";

module.exports = (env, argv) => {
    if ((!argv || !argv.mode) && process.env.ASPNETCORE_ENVIRONMENT === "Development") {
        argv = { mode: "development" };
    }
    console.log("mode=", argv.mode);
    const isDevBuild = argv.mode !== "production";
    const cssLoader = { loader: isDevBuild ? "css-loader" : "css-loader?minimize" };
    return [{
        target: "web",
        mode: isDevBuild ? "development" : "production",
        entry: { "app": ["es6-promise/auto", "aurelia-bootstrapper"] },
        resolve: {
            extensions: [".ts", ".js"],
            modules: ["ClientApp", "node_modules"],
        },
        output: {
            path: path.resolve(bundleOutputDir),
            publicPath: "/dist/",
            filename: "[name].js",
            chunkFilename: "[name].js"
        },
        module: {

            rules: [
                { test: /\.ts$/i, include: [/ClientApp/, /node_modules/], use: "awesome-typescript-loader" },
                { test: /\.html$/i, use: 'html-loader' },
                { test: /\.css$/i, use: isDevBuild ? 'css-loader' : 'css-loader?minimize' },
                { test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' },
                { test: /\.woff2(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader', query: { limit: 10000, mimetype: 'application/font-woff2' } },
                { test: /\.woff(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader', query: { limit: 10000, mimetype: 'application/font-woff' } },
                { test: /\.(ttf|eot|svg|otf)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file-loader' },
                { test: /\.(cur|ani)$/, loader: 'file-loader' }
]



        },
        optimization: {
            splitChunks: {
                cacheGroups: {
                    commons: {
                        test: /[\\/]node_modules[\\/]/,
                        name: "vendor",
                        chunks: "all"
                    }
                }
            }
        },
        devtool: isDevBuild ? "source-map" : false,
        performance: {
            hints: false
        },
        plugins: [
            new webpack.ProvidePlugin({
                'Promise': 'bluebird'
            }),
            new ModuleDependenciesPlugin({
                "aurelia-orm": [
                    "./component/association-select",
                    "./component/view/bootstrap/association-select.html",
                    "./component/view/bootstrap/paged.html",
                    "./component/paged"],
                "aurelia-authentication": ["./authFilterValueConverter"]
            }),
            new webpack.DefinePlugin({ IS_DEV_BUILD: JSON.stringify(isDevBuild) }),
            new AureliaPlugin({ aureliaApp: "boot" }),
            new GlobDependenciesPlugin({ "boot": ["ClientApp/**/*.{ts,html}"] }),
            new ModuleDependenciesPlugin({}),
            extractCSS
        ]
    }];
};

Answer 1

Visual Studio 任务运行程序不直接支持 webpack 4。需要解决方法。看到这个：Issue On Github