开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

社区首页 >专栏 >vue-cli3分环境打包，不压缩包大小问题

vue-cli3分环境打包，不压缩包大小问题

王念博客

发布于 2019-07-25 18:13:10

2.6K0

发布于 2019-07-25 18:13:10

举报

文章被收录于专栏：王念博客王念博客

前言：不说了

地址： https://cli.vuejs.org/zh/guide/mode-and-env.html

1.配置npm run 的模式

在项目的根目录编辑package.json，分为开发测试生产甚至更多。

"scripts": {
  "dev": "vue-cli-service serve --mode dev",
  "test": "vue-cli-service build --mode test",
  "prod": "vue-cli-service build --mode prod"
},

2.创建环境配置文件

在项目的根目录新建以下文件

.env.dev .env.test .env.prod

.env                # 在所有的环境中被载入
.env.local          # 在所有的环境中被载入，但会被 git 忽略
.env.[mode]         # 只在指定的模式中被载入
.env.[mode].local   # 只在指定的模式中被载入，但会被 git 忽略

3.配置环境的默认变量

只能配置 NODE_ENV=production webpack的读取NODE_ENV配置才启用压缩逻辑，默认是dev的NODE_ENV所以打包出来特别大

NODE_ENV = 'production'

4.配置.env环境的业务变量

VUE_APP_NAME= 'abc'

只有以 VUE_APP_ 开头的变量会被 webpack.DefinePlugin 静态嵌入到客户端侧的包中。你可以在应用的代码中这样访问它们：

console.log(process.env.VUE_APP_NAME)

https://my.oschina.net/wangnian/blog/write/draft/2328599

本文参与腾讯云自媒体分享计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体分享计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

0 条评论

热度

最新

LV.

目录

1.配置npm run 的模式
2.创建环境配置文件
3.配置环境的默认变量
4.配置.env环境的业务变量