vue.js - 关于vue的例子webpack-simple的疑问？

问题描述

问 题

我在研究vue的webpack-simple这个例子时遇到这样一个包。cross-env
它分别出现在几个地方。
1.package.json

"devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "cross-env": "^5.0.5",
    "css-loader": "^0.28.5",
    "file-loader": "^0.11.2",
    "vue-loader": "^13.0.4",
    "vue-template-compiler": "^2.4.2",
    "webpack": "^3.5.5",
    "webpack-dev-server": "^2.7.1"
  },

2.package.json

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot"
  },

3.webpack.config.js

if (process.env.NODE_ENV === 'production') {
    module.exports.devtool = '#source-map'
    // http://vue-loader.vuejs.org/en/workflow/production.html
    module.exports.plugins = (module.exports.plugins || []).concat([
      new webpack.DefinePlugin({
        'process.env': {
          NODE_ENV: '"production"'
        }
      }),
      new webpack.optimize.UglifyJsPlugin({
        sourceMap: true,
        compress: {
          warnings: false
        }
      }),
      new webpack.LoaderOptionsPlugin({
        minimize: true
      })
    ])
  }

我查了一下cross-env应该与环境变量有关？
我想问一下在这个例子中是如何体现的的呢？
我的理解是它单纯的用于webpack区分build还是dev。
求解释，谢谢。

解决方案

这个东西是兼容windows跟mac的，这两个环境，设置NODE_ENV变量时语法不一样。windows配好的在mac跑还要改，会比较烦，这就是它的用处。
就是json里的script那一块。
webpack区分开发还是生产跟它没直接关系。

这篇关于vue.js - 关于vue的例子webpack-simple的疑问？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！