wenpack配置拿不到环境变量

Question

我按照webpack官访文档设置了dev和prod环境的配置；一直报下面这个错：拿不到环境的变量，这个是什么问题啊？

**配置代码如下：**

"build:dev": "webpack --env=dev --progress --profile --colors",
 "build:dist": "webpack --env=prod --progress --profile --colors"


通用配置：base.js
const webpack = require('webpack');
const glob = require('glob');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
const All_Entry = require('./entrys.js');

const HtmlPlug = function(tit, name, arr) {
    return {
        title: tit,
        filename: name + '.html',
        template: './public/index.html',
        chunks: arr,
        chunksSortMode: "manual"
    }
}

module.exports = function() {
    return {
        entry: All_Entry,
        //  devtool: 'source-map',
        output: {
            path: path.resolve(__dirname, './build/'),
            filename: 'js/[name].[chunkhash:6].js'
        },
        //设置开发者工具的端口号,不设置则默认为8080端口
        devServer: {
            inline: true,
            port: 8181
        },
        module: {
            rules: [{
                    test: /\.js?$/,
                    exclude: /node_modules/,
                    loader: 'babel-loader',
                    query: {
                        presets: ['es2015', 'react']
                    }
                }, {
                    test: /\.(scss|sass|css)$/,
                    loader: ExtractTextPlugin.extract({
                        fallback: "style-loader",
                        use: "css-loader"
                    })
                },

            ]
        },
        plugins: [

            new ExtractTextPlugin("css/[name].[chunkhash:6].css"),
            new CleanWebpackPlugin(
                ['build'], {
                    root: __dirname,
                    verbose: true,
                    dry: false
                }
            ),

            new HtmlWebpackPlugin(HtmlPlug('登录', 'login', ['routeconfig', 'commom', 'login'])),
            new HtmlWebpackPlugin(HtmlPlug('首页', 'index', ['commom', 'index'])),
            new HtmlWebpackPlugin(HtmlPlug('注册', 'resiger', ['commom', 'resiger'])),

            new HtmlWebpackPlugin(HtmlPlug('商品详情', 'detail', ['commom', 'detail'])),

            new webpack.optimize.CommonsChunkPlugin({
                name: 'commom'
            }),

        ],
    }
};



**本地：dev.js**
const webpackMerge = require('webpack-merge');
const commonConfig = require('./base.js');

module.exports = function(env) {

        return webpackMerge(commonConfig(), {
                devtool: 'source-map',
            }

        }


**生产：prod.js**
const webpackMerge = require('webpack-merge');
const commonConfig = require('./base.js');

module.exports = function(env) {
        return webpackMerge(commonConfig(), {
                plugins: [
                    new webpack.DefinePlugin({
                        'process.env': {
                            'NODE_ENV': JSON.stringify('prod')
                        }
                    }),
                    new webpack.optimize.UglifyJsPlugin({
                        beautify: false,
                        mangle: {
                            screw_ie8: true,
                            keep_fnames: true
                        },
                        compress: {
                            screw_ie8: true
                        },
                        comments: false
                    })
                ],
            }
        }
        
    
    **配置入口：webpack.config.js**
    function buildConfig(env) {
        console.log('----------------');
      return require('./config/' + env + '.js')({ env: env })
    }
    
    module.exports = buildConfig(env);

Answer 1

webpack.config.js 里面 buildConfig 传入的参数改成 process.env.env

Answer 2

    **配置入口：webpack.config.js**
    function buildConfig(env) {
        console.log('----------------');
      return require('./config/' + env + '.js')({ env: env })
    }
    
    module.exports = buildConfig(env);

webpack配置如是是一个函数，函数的参数是webpack运行时决定的，所以直接这样改就可以

function buildConfig(env) {
      return require('./config/' + env + '.js')
    }
    
    module.exports = buildConfig;