深入浅析vue中cross-env的使用


Posted in Javascript onSeptember 12, 2019

cross-env

cross-env是跨平台设置和使用环境变量的脚本。

在大多数Windows命令行中在使用NODE_ENV = production设置环境变量时会报错。同样,Windows和Linux命令如何设置环境变量也有所不同。

使用 cross-env 可以设置在不同的平台上有相同的NODE_ENV参数。

使用

安装

npm install cross-env --save-dev
package.json
"scripts": {
  "serve": "cross-env NODE_ENV=development vue-cli-service serve --open",
  "build": "cross-env NODE_ENV=production vue-cli-service build"
}

development
production

process为node的全局变量

适用场景

适用于本地线上环境有差异的场景,例如本地线上使用不用的开发域名则可以通过 NODE_ENV 来判断

if(process.env.NODE_ENV!='development'){
  //线上环境
}

知识点扩展:cross-env使用笔记

cross-env能跨平台地设置及使用环境变量

大多数情况下,在windows平台下使用类似于: NODE_ENV=production的命令行指令会卡住,windows平台与POSIX在使用命令行时有许多区别(例如在POSIX,使用$ENV_VAR,在windows,使用%ENV_VAR%。。。)

cross-env让这一切变得简单,不同平台使用唯一指令,无需担心跨平台问题

npm安装方式

npm i --save-dev cross-env

在npm脚本(多是package.json)里这么配置

{
 "scripts": {
  "build": "cross-env NODE_ENV=production webpack --config build/webpack.config.js"
 }
}

运行npm run build,这样NODE_ENV便设置成功,无需担心跨平台问题

总结

以上所述是小编给大家介绍的vue中cross-env的使用,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法
Jan 12 Javascript
JS 精确统计网站访问量的实例代码
Jul 05 Javascript
js操作table示例(个人心得)
Nov 29 Javascript
解决js下referer兼容各大浏览器的方法
Nov 03 Javascript
js实现点击添加一个input节点
Dec 05 Javascript
javascript面向对象之定义成员方法实例分析
Jan 13 Javascript
jQuery解析Json实例详解
Nov 24 Javascript
jQuery实现的无限级下拉菜单功能示例
Sep 12 Javascript
JS实现的简单折叠展开动画效果示例
Apr 28 Javascript
JS实现计算小于非负数n的素数的数量算法示例
Feb 26 Javascript
jQuery实现图片切换效果
Oct 19 jQuery
使用vue3重构拼图游戏的实现示例
Jan 25 Vue.js
layui form表单提交之后重新加载数据表格的方法
Sep 11 #Javascript
layer弹出层显示在top顶层的方法
Sep 11 #Javascript
layer.js之回调销毁对话框的例子
Sep 11 #Javascript
layer.alert回调函数执行关闭弹窗的实例
Sep 11 #Javascript
JavaScript 斐波那契数列 倒序输出 输出100以内的质数代码实例
Sep 11 #Javascript
浅谈layui框架自带分页和表格重载的接口解析问题
Sep 11 #Javascript
Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法
Sep 11 #Javascript
You might like
PHP序列号生成函数和字符串替换函数代码
2012/06/07 PHP
浅谈使用PHP开发微信支付的流程
2015/10/04 PHP
PHP获取昨天、今天及明天日期的方法
2016/02/03 PHP
laravel orm 关联条件查询代码
2019/10/21 PHP
提高 DHTML 页面性能
2006/12/25 Javascript
用JS控制回车事件的代码
2011/02/20 Javascript
页面回到顶部的三种实现(锚标记,js)
2012/10/01 Javascript
Javascript Memoizer浅析
2014/10/16 Javascript
JavaScript阻止事件冒泡示例分享
2014/12/28 Javascript
jQuery中:last-child选择器用法实例
2014/12/31 Javascript
JS实现仿QQ聊天窗口抖动特效
2015/05/10 Javascript
jquery实现鼠标滑过显示二级下拉菜单效果
2015/08/24 Javascript
AngularJS基础 ng-selected 指令简单示例
2016/08/03 Javascript
js实现的光标位置工具函数示例
2016/10/03 Javascript
JS中split()用法(将字符串按指定符号分割成数组)
2016/10/24 Javascript
微信小程序 仿猫眼实现实例代码
2017/03/14 Javascript
信息滚动效果的实例讲解
2017/09/18 Javascript
JavaScript的数据类型转换原则(干货)
2018/03/15 Javascript
详解使用Next.js构建服务端渲染应用
2018/07/10 Javascript
Angular 实现输入框中显示文章标签的实例代码
2018/11/07 Javascript
Nodejs libuv运行原理详解
2019/08/21 NodeJs
javascript数组元素删除方法delete和splice解析
2019/12/09 Javascript
javascript实现倒计时关闭广告
2021/02/09 Javascript
python+rsync精确同步指定格式文件
2019/08/29 Python
Python中Flask-RESTful编写API接口(小白入门)
2019/12/11 Python
Python自动采集微信联系人的实现示例
2020/02/28 Python
pycharm软件实现设置自动保存操作
2020/06/08 Python
Python timeit模块原理及使用方法
2020/10/10 Python
Cpython解释器中的GIL全局解释器锁
2020/11/09 Python
python中绕过反爬虫的方法总结
2020/11/25 Python
小女主人连衣裙:Little Mistress
2017/07/10 全球购物
会计毕业自我鉴定
2014/02/05 职场文书
超市创业计划书
2014/04/24 职场文书
特岗教师个人总结
2015/02/10 职场文书
《小摄影师》教学反思
2016/02/18 职场文书
Python WSGI 规范简介
2021/04/11 Python