if(process.env.NODE_ENV ==='生产')始终为false [英] if(process.env.NODE_ENV === 'production') always false

问题描述

当尝试通过从package.json上的此脚本列表中运行build命令来构建angular-webpack应用程序时:

When trying to build an angular-webpack application by running the build command from this scripts list on the package.json:

"scripts": {
    "test": "NODE_ENV=test karma start",
    "build":  "if exist dist rd /s /q dist && mkdir dist && set NODE_ENV=production && webpack && cp app/index.html dist/index.html",
    "start": "webpack-dev-server --content-base app"
  },

这是控制台上的结果:

$ npm run build

    > webpack-ng-egg@1.0.0 build M:\Learning webpack\egghead.io - AngularJS - Angula
    r and Webpack for Modular Applications\webpack-ng-egg
    > if exist dist rd /s /q dist && mkdir dist && set NODE_ENV='production' && webp
    ack && cp app/index.html dist/index.html

    process.env.NODE_ENV  : 'production'
    process.env.NODE_ENV === 'production' ????  : false
    Hash: c3136b0024cbd48ccb2e
    Version: webpack 1.13.2
    Time: 3185ms
        Asset     Size  Chunks             Chunk Names
    bundle.js  1.23 MB       0  [emitted]  main
        + 10 hidden modules

这是webpack.config.js文件的外观:

this is how looks like the webpack.config.js file :

 var webpack = require('webpack');
    var path = require('path');
    var config = {
        context: path.resolve(__dirname, "app"),
        entry:'./app.js',
        output: {
            path : __dirname + '/app',
            filename:'bundle.js' // il ne sera pas généré dans le code, juste en mémoire
        },
        plugins:[
            new webpack.DefinePlugin({
                ON_TEST:process.env.NODE_ENV === 'test'
            })
        ],
        module:{
            loaders: [
            {
              test: /\.js$/,
              exclude: /(node_modules|bower_components)/,
              loader: 'babel', // 'babel-loader' is also a legal name to reference
              query: {
                presets: ['es2015']
              }
            },
             { test: /\.css$/,
               loader: "style-loader!css-loader",
               exclude: /(node_modules|bower_components)/
             },
            {
              test: /\.html$/,
              exclude: /(node_modules|bower_components)/,
              loader: 'raw', // 'babel-loader' is also a legal name to reference
            },
            {  test: /\.styl$/,
               loader: 'style-loader!css-loader!stylus-loader',
               exclude: /(node_modules|bower_components)/
             }
          ]
        },
        devServer:{
            //contentBase:path.join(__dirname, 'dist') // ceci est juste un exemple, si dist est l'endroit ou on aurait généré les fichiers
            inline:true, // les mises à jour de style ne sont plus affichés instantnément avec cette option donc j'ai ajouté le watch:true et çà marché!!!
            watch:true

        }
        /*resolve: {
            extensions: ['', '.js', '.jsx', '.css']
        },
        resolveLoader: {
            root: require('path').resolve(__dirname, "node_modules")
        }*/
    }

    console.log("process.env.NODE_ENV  : " + process.env.NODE_ENV);
    console.log("process.env.NODE_ENV === 'production' ????  : " + (process.env.NODE_ENV == 'production'));
    //config.output.path = path.resolve(__dirname, "dist");
    //console.log("config.output.path  : " + config.output.path);


    if(process.env.NODE_ENV === 'production') {
        console.log("this is the prod env!!!!!!!!!!");
        config.output.path = path.resolve(__dirname, "dist");
    }

    module.exports = config;

这里的问题是，在测试(process.env.NODE_ENV === 'production')时，即使它应该是它，也永远不会返回true(请参阅上面控制台上记录的内容).我试图追求一种简单的平等，而不是严格的平等，但始终都是虚假的.

the problem here is that when testing (process.env.NODE_ENV === 'production') it never returns true even that it's supposed to be (see what is logged on the console above). I have tried to chage to a simple equality instead the strict one but still get false all the time.

推荐答案

我今天遇到了这个问题.

I had this problem today.

当我在npm scripts中使用set NODE_ENV=production && something时，NODE_ENV=production变为production + " "，后面有一个空格.

When I used set NODE_ENV=production && something in npm scripts then NODE_ENV=production becomes production + " " with one whitespace after it.

因此，我们将production与production + " "进行比较，显然这将返回false.

So, we are comparing production with production + " ", this obviously returns false.

package.json

package.json

scripts: {
    "start": "set NODE_ENV=development && webpack --watch --progress",
    "test": "set NODE_ENV=production && webpack"
}

比较

console.log(process.env.NODE_ENV.trim() === "production"); //True if ran test else false
console.log(process.env.NODE_ENV === "production"); //False
console.log(process.env.NODE_ENV.trim() === "development"); //True if ran start else false
console.log(process.env.NODE_ENV === "development"); //False

webpack.config.js的工作示例

Working sample of webpack.config.js

const webpack = require("webpack");
const dev = process.env.NODE_ENV.trim() !== "production";

module.exports = {
    entry: "./index.js",
    output: {
        path: "./",
        filename: "parse.js"
    },
    module: {
        rules: [
            {
                test: /\.js/,
                use: "babel-loader",
                exclude: /node_modules/
            }
        ]
    },
    plugins: dev ? [] : [
        new webpack.optimize.UglifyJsPlugin()
    ],
    target: "node"
};

因此，请使用trim().

这篇关于if(process.env.NODE_ENV ==='生产')始终为false的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！