vue-cli-service build 自定义参数

vue-cli-service build 自定义参数

  1. vue-cli-service build
    (1)**作用:**是打包资源文件
    (2)**工具:**通过脚手架依赖的dotenv模块实现参数定义和读取
    (3)**原理:**detenv作用是将环境变量从.env文件加载到process.env中,代码就可以通过process.env.VUE_APP_XX访问自定义的VUE_APP_XX的值了

  2. 在vue-cli-service的packjson中切换环境
    (1) 在运行时如果需要区分生产环境和测试环境,只需要
    “scriptes”: {
    “serve”: “vue-cli-service serve”, // 会将process.env.NODE_ENV设置为development
    “build”: “vue-cli-service build” // 会将process.env.NODE_ENV设置为production
    }

(2)在build时在dist/目录会有用于生产环境的包,需要添加选项–mode区分测试环境和生产环境
“scripts”: {
“build:test”: “vue-cli-service build --mode test”, // 测试环境
“build:prod”: “vue-cli-service build --mode prod”, // 生产环境
},

"build:dev": "vue-cli-service build --mode dev",	// 打包开发环境
"build:test": "vue-cli-service build --mode test",	// 打包集成测试
"build:uat": "vue-cli-service build --mode uat",	// 打包验收测试
"build:prod": "vue-cli-service build --mode prod",	// 打包生产环境
  • 2
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vue-cli-service build 是 Vue CLI 提供的一个用于构建生产环境的命令。在构建的过程中,可以使用配置文件来对构建过程进行定制和配置。 配置文件位于项目的根目录下的 vue.config.js 文件中,通过对该文件进行编辑,可以达到自定义构建配置的目的。 在 vue.config.js 文件中,可以配置多个选项来定制构建过程。下面是一些常用的配置选项: 1. publicPath:配置构建结果中的静态资源的基础路径。可以设置为相对路径或绝对路径。 2. outputDir:配置构建结果的输出目录,默认为 "dist"。 3. assetsDir:配置构建结果中存放静态资源的目录,默认为 "static"。 4. indexPath:配置构建结果中的入口HTML文件的路径,默认为 "index.html"。 5. filenameHashing:配置构建结果中静态资源文件名是否包含hash,默认为 true。 6. productionSourceMap:配置是否生成生产环境的source map,默认为 false。 7. configureWebpack:配置合并到最终的webpack配置中的对象。 8. chainWebpack:通过链式调用方式配置webpack的内部配置。 9. css相关配置:可以配置是否启用CSS提取、是否开启CSS的source map等。 10. devServer:配置开发服务器的相关选项,如主机、端口、代理等。 以上仅为一些常用的配置选项,还可以根据具体需求进行更多的配置。通过对 vue.config.js 文件的配置,我们可以实现对构建过程的灵活定制,达到最适合项目需求的构建结果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值