vue-cli中的babel配置文件.babelrc实例详解


Posted in Javascript onFebruary 22, 2018

本文介绍vue-cli脚手架工具根目录的babelrc配置文件

介绍

es6特性浏览器还没有全部支持,但是使用es6是大势所趋,所以babel应运而生,用来将es6代码转换成浏览器能够识别的代码

babel有提供专门的命令行工具方便转码,可以自行去了解

vue-cli脚手架的.babelrc文件

{
 // 此项指明,转码的规则
 "presets": [
 // env项是借助插件babel-preset-env,下面这个配置说的是babel对es6,es7,es8进行转码,并且设置amd,commonjs这样的模块化文件,不进行转码
 ["env", { "modules": false }],
 // 下面这个是不同阶段出现的es语法,包含不同的转码插件
 "stage-2"
 ],
 // 下面这个选项是引用插件来处理代码的转换,transform-runtime用来处理全局函数和优化babel编译
 "plugins": ["transform-runtime"],
 // 下面指的是在生成的文件中,不产生注释
 "comments": false,
 // 下面这段是在特定的环境中所执行的转码规则,当环境变量是下面的test就会覆盖上面的设置
 "env": {
 // test 是提前设置的环境变量,如果没有设置BABEL_ENV则使用NODE_ENV,如果都没有设置默认就是development
 "test": {
  "presets": ["env", "stage-2"],
  // instanbul是一个用来测试转码后代码的工具
  "plugins": ["istanbul"]
 }
 }
}

ps:下面给大家介绍关于.babelrc配置文件

关于react项目结构,有很多配置文件,有时候觉得很难理解。

比如.babelrc文件,这个文件是用来设置转码的规则和插件的。

熟悉linux的话一定知道,rc结尾的文件通常代表运行时自动加载的文件,配置等等。在babel6中,这个文件必不可少。
里面可以对babel命令进行配置,以后再使用babel的cli的时候,可以少一些配置。还有一个env字段,可以对BABEL_ENV或者NODE_ENV指定的不同的环境变量,进行不同的编译操作。

总结

以上所述是小编给大家介绍的vue-cli中的babel配置文件.babelrc实例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 构建一个xmlhttp对象池合理创建和使用xmlhttp对象
Jan 15 Javascript
hover的用法及live的用法介绍(鼠标悬停效果)
Mar 29 Javascript
jQuery+json实现的简易Ajax调用实例
Dec 14 Javascript
JavaScript的React框架中的JSX语法学习入门教程
Mar 05 Javascript
js表单登陆验证示例
Oct 19 Javascript
JavaScript的变量声明提升问题浅析(Hoisting)
Nov 30 Javascript
使用Bootstrap + Vue.js实现添加删除数据示例
Feb 27 Javascript
jQuery选择器之子元素过滤选择器
Sep 28 jQuery
手把手教你使用vue-cli脚手架(图文解析)
Nov 08 Javascript
Vue实现远程获取路由与页面刷新导致404错误的解决
Jan 31 Javascript
Vue CLI3.0中使用jQuery和Bootstrap的方法
Feb 28 jQuery
jQuery实现的导航条点击后高亮显示功能示例
Mar 04 jQuery
利用adb shell和node.js实现抖音自动抢红包功能(推荐)
Feb 22 #Javascript
浅谈webpack打包生成的bundle.js文件过大的问题
Feb 22 #Javascript
babel之配置文件.babelrc入门详解
Feb 22 #Javascript
javascript填充默认头像方法
Feb 22 #Javascript
一次记住JavaScript的6个正则表达式方法
Feb 22 #Javascript
利用CDN加速react webpack打包后的文件详解
Feb 22 #Javascript
node内置调试方法总结
Feb 22 #Javascript
You might like
php学习笔记之 函数声明(二)
2011/06/09 PHP
Extjs 几个方法的讨论
2010/01/28 Javascript
js实现点击后将文字或图片复制到剪贴板的方法
2014/08/04 Javascript
$.extend 的一个小问题
2015/06/18 Javascript
JavaScript脚本库编写的方法
2015/12/09 Javascript
仿iframe效果Aajx文件上传实例
2016/11/18 Javascript
vue router2.0二级路由的简单使用
2017/07/05 Javascript
微信小程序实现自上而下字幕滚动
2018/07/14 Javascript
springMvc 前端用json的方式向后台传递对象数组方法
2018/08/07 Javascript
利用js将ajax获取到的后台数据动态加载至网页中的方法
2018/08/08 Javascript
在Node.js下运用MQTT协议实现即时通讯及离线推送的方法
2019/01/24 Javascript
详解vue中使用vue-quill-editor富文本小结(图片上传)
2019/04/24 Javascript
layui对工具条进行选择性的显示方法
2019/09/19 Javascript
vue如何在用户要关闭当前网页时弹出提示的实现
2020/05/31 Javascript
JS实现简单打字测试
2020/06/24 Javascript
Vue中关闭弹窗组件时销毁并隐藏操作
2020/09/01 Javascript
[01:12:44]VG vs Mineski Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
Python矩阵常见运算操作实例总结
2017/09/29 Python
详解pyenv下使用python matplotlib模块的问题解决
2018/11/29 Python
OpenCV 模板匹配
2019/07/10 Python
python 动态迁移solr数据过程解析
2019/09/04 Python
python向图片里添加文字
2019/11/26 Python
Python高级特性——详解多维数组切片(Slice)
2019/11/26 Python
浅谈tensorflow之内存暴涨问题
2020/02/05 Python
用CSS3写的模仿iPhone中的返回按钮
2015/04/04 HTML / CSS
世界上最大的各式箱包网络零售店:eBag
2016/07/21 全球购物
美国最受欢迎的度假租赁网站:VRBO
2016/08/02 全球购物
TripAdvisor瑞典:全球领先的旅游网站
2017/12/11 全球购物
党员个人思想汇报
2013/12/28 职场文书
大学生创业策划书
2014/02/02 职场文书
社区志愿者培训方案
2014/06/10 职场文书
英语系毕业生求职信
2014/07/13 职场文书
2014年班组长工作总结
2014/11/20 职场文书
龙猫观后感
2015/06/09 职场文书
工作经历证明范本
2015/06/15 职场文书
Python OpenCV 图像平移的实现示例
2021/06/04 Python