Hbuilder中添加Babel自动编译
Hbuilder是一个不错的H5开发IDE。
Babel是EMCAScript最新标准的编译器,很多ES的最新特性都可以在Babel中尝试。
如果可以有办法在Hbuilder中直接使用ES6,并通过Babel自动转化为ES5,那么对于使用ES6+Hbuilder进行开发调试将会非常方便。
简单做了些配置,可以通过以下步骤达到目的。
- Hbuilder配置 - 打开ES6
- 安装NPM
- 下载NPM安装
- 通过NPM安装babel-cli
npm install --global babel-cli
- 安装babel preset
npm install --global babel-preset-env
- 配置Hbuilder中的预编译器设置
根据实际情况,填写以上信息。
- 测试JS文件保存,自动生成babel转换后的JS代码
每次项目中的JS文件保存后,都会将编译后的代码文件放在项目中dist/下。
以上步骤,在windows环境下验证。
Hbuilder中添加Babel自动编译的更多相关文章
- MyEclipse 中 添加 js自动完成模版
MyEclipse 中 添加 js自动完成模版: window>preference>MyEclipse>Files and Editors>JavaScript>Edi ...
- 小tips:Hbuilder编辑器开启less自动编译为css的方法
1.首先,依次打开菜单栏->工具->预编译器设置,打开后是这样的: 2.然后点击新建. 3.文件后缀为.less触发命令地址就是lessc.cmd所在的地址,先用npm全局安装less, ...
- 利用babel自动编译es6文件
一.检查File-Watchers中Babel的Arguments,有一项presets的设置,把他更改为=es2015,详细设置如下: $FilePathRelativeToProjectRoot$ ...
- IDEA中添加javap反编译
- 怎样在vs2013和vs2015中实现自动编译sass
Visual Studio不论是2013版本还是2015版本要自动编译都需要添加扩展. 添加扩展的方法,路径“工具”->“扩展和更新”,在打开的窗口“搜索”你需要的扩展根据提示“下载”和“安装” ...
- 使用ant自动编译安卓项目并签名
准备阶段: 1.下载ant,jdk,android sdk ant下载地址:ant.apache.org/bindownload.cgi 2. 设置环境变量 ANT_HO ...
- ant自动编译打包android项目
源代码及可执行文件下载地址:http://files.cnblogs.com/rainboy2010/antdemo.zip Android打包APK的流程如下: 下面我们开始尝试使用ant进行ap ...
- 【ts】 VSCode自动编译TypeScript终端报错
一.点击终端--运行任务--选择tsc:监视 - tsconfig.json后,终端报出了如下错误:error TS5058: The specified path does not exist 在网 ...
- WebStorm ES6 语法支持设置&babel使用及自动编译
一.语法支持设置 Preferences > Languages & Frameworks > JavaScript 二.Babel安装 1.全局安装 npm install -g ...
随机推荐
- Winfrom 简单的安卓手机屏幕获取和安卓简单操作
为啥我要做这个东西了,是因为经常要用投影演示app ,现在有很多这样的软件可以把手机界面投到电脑上 ,但都要安装,比如说360的手机助手,我又讨厌安装,于是就自己捣鼓了下 做了这个东西, 实现了以下简 ...
- JavaScript配合button.onclick()使用总结
Html加载顺序是从上往下加载,如果script中含有引用js脚本,则应该将此script放在head标签里面,这样可是保证此页面都可以引用js脚本内容.如果想在script中设置button.onc ...
- 初识oracle存储过程
参见:http://www.cnblogs.com/linjiqin/archive/2011/04/16/2018411.html 1.存储过程的语法结构: CREATE OR REPLACE PR ...
- 【个人笔记】《知了堂》express模块
NPM 包管理器 Node package module ==>简称npm 类似的bower 安装express 1.全局Npm install express -g 2.项目中安装 项目中 ...
- Java钉钉开发_01_开发前的准备
源码已上传GitHub:传送门 一.准备事项 1.1 一个能在公网上访问的项目: 参见:Java微信开发_02_本地服务器映射外网 1.2 一个钉钉账号 去注册 1.3 创建一个应用 登录钉钉后台 ...
- PHP常用数组(Array)函数整理
整理了一份PHP开发中数组操作大全,包含有数组操作的基本函数.数组的分段和填充.数组与栈.数组与列队.回调函数.排序.计算.其他的数组函数等. 一.数组操作的基本函数 数组的键名和值 array_va ...
- vue语法之拼接字符串
先来一行代码: <div class="swiper-slide" v-for="item in message"> <img v-bind: ...
- python urllib、urlparse、urllib2、cookielib
1.urllib模块 1.urllib.urlopen(url[,data[,proxies]]) 打开一个url的方法,返回一个文件对象,然后可以进行类似文件对象的操作.本例试着打开google i ...
- MVC中View界面数据呈现示例
@using System.Text; @model List<MvcShopping.Models.ProductCategory> @{ ViewBag.Title = "测 ...
- 初学者易上手的SSH-struts2 02Action获取表单数据-通配符
在上一章中,我们已经搭建好了struts2的一个开发环境,那么这一章就来做一个简单的登录功能,以及介绍和使用struts2里面一个重要的东西-通配符. 第一步,在WebContent下面新建一个log ...