cross-env使用以及根据环境打包

bbbbbb 发布于2019-08-23 18:24 / 3411人阅读

摘要：例外是上的，它使用本机。同样，和命令如何利用环境变量也有所不同。第二步，修改文件新增一条如上命令当执行时，设置为同理设置为然后在文件中即可根据这个变量设置相应的路径。关于文章首发于使用以及根据环境打包

关于

之前的项目打包都是靠手动去改环境变量(纯属沙雕行为)，随着项目越来越多，每一个项目打包都要去改这个变量的话真的是太蛋疼了，所以研究了一下webpack打包以及node env

主要

这样做有什么好处?

  publicPath: process.env.APP_ENV === "production" ? "https://cdn.xxxx.com/brand-mall-chengdong/" : "/",
  outputPath: "./brand-mall-chengdong",

之前都是每次打包手动修改这个静态资源的地址，修改之后根据环境变量自动区分

第一步，安装cross-env

yarn add cross-env@5.1.1 cross-port-killer@1.0.1

什么是cross-env?
解:当您使用NODE_ENV=production类似设置环境变量时，大多数Windows命令提示将会阻塞 。（例外是Windows上的Bash，它使用本机Bash。）同样，Windows和POSIX命令如何利用环境变量也有所不同。使用POSIX，您可以使用：$ENV_VAR 和您使用的Windows %ENV_VAR%。

第二步，修改package.json文件

    "build": "cross-env APP_ENV=production umi build",
    "build:test": "cross-env APP_ENV=test umi build",

新增一条如上命令,当执行npm run build时，设置proess.env.APP_ENV为production ,同理设置为test.然后在config.js文件中即可根据这个变量设置相应的路径。

关于

文章首发于cross-env使用以及根据环境打包

idc机房托管专线服务亚马逊云服务器租用以及使用使用签名文件打包程序 php开发环境使用火车头php使用环境

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105168.html

vue:不同环境配置不同的打包命令

摘要：最近做的一个项目是配置了三个环境的正式环境测试环境和开发环境，下面以这个为例第一步安装或者在中加上进行安装依赖这是我项目的目录第二步修改各环境下的参数在目录下添加。最近做的一个项目是配置了三个环境的：正式环境、测试环境和开发环境，下面以这个为例第一步：安装cross-env npm i --save-dev cross-env 或者在 package.json中加上cross-e...

gyl_coder 2019-08-23 16:47 评论0 收藏0
五步带你完成vue-cli 项目打包一键部署（测试）服务

摘要：初始化项目测试服务已经准备前提已经准备好了注意一键部署都可以使用在根目录新建文件夹类容如下类容如下文件类容如下正在发布到生产测试服务器这个路径是你需要上传到服务器的文件夹路径发布失败成功发布到生产测试服务器文件类容如下读取环境变量文件判断打初始化vue项目, 测试服务已经准备（前提已经准备好了）注意: 一键部署 vue2.0~3.0 都可以使用 1、在根目录新建deploy 文件...

cgh1999520 2019-08-23 16:54 评论0 收藏0
umi 配置多环境打包

摘要：平时我们开发应用时环境有开发环境测试环境生产环境等此时我们需要配置不同的环境获取不同的前缀，以满足日常开发需要。安装插件在文件里配置开发环境的复制两次，并更改文件名为和分别配置在其他文件可以获取作为前缀如封装的在的处配置打包命令平时我们开发应用时环境有开发环境、测试环境、生产环境等,此时我们需要配置不同的环境,获取不同的apiUrl前缀，以满足日常开发需要。 1.安装 cross-e...

cyrils 2019-08-23 15:04 评论0 收藏0
基于webpack模仿vue-cli（简略版）工程化

摘要：但高度封装的带来方便的同时，很多人却很少去关注轮子的内部结构，以至于当使用需要手动配置一些东西如编译实现代码压缩，移动端适配等配置的时候往往无从下手。废话不多说，下面我们来看看如何基于模仿实现项目工程化。从零搭建vue-cli 原创不易，如需转载请联系作者并注明出处 vue-cli的出现为vue工程化前端开发工作流提供了开箱即用的构建配置，减轻了烦人的webpack配置流程。但高度封...

GitCafe 2019-08-26 11:35 评论0 收藏0