铁雪资源网 Design By www.gsvan.com

webpack.DefinePlugin与cross-env常用于在项目工程化中定义环境变量,webpack.DefinePlugin用于在编译期定义环境变量,意味着在代码中写上process.env.NODE_ENV不会在编译期出现错误提醒;cross-env库用于在运行时定义环境变量
DefinePlugin用来做定义。这就类似于我们项目开发中的config文件一样,在config文件中一般放的是系统代码中的一些服务器地址之类的公共信息,我们将这些信息提取出来单独放在配置文件中,方便于后期的维护和管理。

// dev.env.js
module.exports = {
  NODE_ENV: 'development'
}
// prod.env.js
module.exports = {
  NODE_ENV: 'production'
}
// webpack配置
const env = require('../config/dev.env')
module.exports = {
  entry: {},
  output: {},
  resolve: {
    extensions: ['.js']
  }
  module: {},
  plugins: [
    new webpack.DefinePlugin({
      'process.env': env.NODE_ENV
    })
  ]
}
// package.json
{
  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "build": "node build/build.js",
    "build:development": "cross-env NODE_ENV=dev node build/build.js",
    "build:test": "cross-env NODE_ENV=test node build/build.js",
    "build:pre": "cross-env NODE_ENV=pre node build/build.js",
    "build:prod": "cross-env NODE_ENV=prod node build/build.js"
  }
}

标签:
webpack.DefinePlugin,webpack,cross-env

铁雪资源网 Design By www.gsvan.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
铁雪资源网 Design By www.gsvan.com

评论“webpack.DefinePlugin与cross-env区别详解”

暂无webpack.DefinePlugin与cross-env区别详解的评论...