npm install --save-dev gulp-babel
npm install --save-dev babel-preset-es2015
var gulp = require("gulp");
var babel = require("gulp-babel"); gulp.task("default", function () {
return gulp.src("webRoot/src/**/*.js")// ES6 源码存放的路径
.pipe(babel())
.pipe(gulp.dest("webRoot/dist")); //转换成 ES5 存放的路径
});

  在项目根路径创建文件 .babelrc。内容为

{
"presets": ["es2015"]
}

  就在刚刚安装好了以后,发现除了一个错误

不知啥时候,他必须要配合这个东西才能用,于是我有npm install --save-dev babel-core就好了。

还有那个gulp配置的地方,地址要加上根目录不然也会报错。

gulp-babel,es6转es5的更多相关文章

  1. gulp自动化ES6转ES5

    npm install --save-dev gulp npm install --save-dev gulp-babel npm install --save-dev babel-preset-es ...

  2. 使用babel es6 转 es5

    安装 //Webpack 接入 Babel 必须依赖的模块 npm i -D babel-core babel-loader //preset,告诉babel编译的文件中用到了哪些语法env包含当前所 ...

  3. ES6转ES5:Gulp+Babel

    目标: ES6代码转成ES5 对转换后的ES5进行压缩 以上步骤自动监控执行 步骤: 1.安装插件 在命令行中定位到项目根目录 安装全局 Gulp npm install -g gulp 安装项目中使 ...

  4. 使用gulp+bebal实现前端自动化es6转es5的构建

    说明:es6语法已经越来越普及,但是一些低版本的浏览器不支持es6的语法特性,所以我们在开发完前端项目后,往往需要统一把前端es6的代码编译成es5的代码.本文介绍的就是如何手动和自动的把es6转成e ...

  5. ES6 初体验 —— gulp+Babel 搭建ES6环境

    ES6已经火了好久了,我却一直没有在项目中尝试过使用ES6写代码,只是写过几个Demo,在大型项目中使用ES6这件事,我一直不太敢做.最近公司要求做一个小的H5活动专题,我想不如就在这个小项目中使用E ...

  6. 前端构建工具 Gulp 压缩合并JS/CSS 并添加版本号、ES6转ES5

    Gulp 基于 Node.js 的前端构建工具,可以实现前端代码的编译(sass.less).压缩合并(JS.CSS).测试:图片的压缩:已经添加 JS 和 CSS 版本号,防止浏览器缓存. 1. 安 ...

  7. gulp+Babel 搭建ES6环境

    Gulp是什么? Gulp是一个工作流的构建系统,开发者可以使用它在网站开发过程中自动执行常见任务.Gulp是基于Node.js构建的,因此Gulp源文件和你用来定义任务的Gulp文件都被写进了Jav ...

  8. Babel 转码器 § es6转换es5

    Babel 转码器 § es6转换es5 实时转码 /  Repl  -babel-node / babel-register(自动转码引入babel-register模块) 配置文件.babelrc ...

  9. gulp es6 转 es5

    npm install --save-dev gulp-babel babel-preset-es2015 var babel = require("gulp-babel"); / ...

  10. 让浏览器兼容ES6语法(gulp+babel)

    使用gulp+babel搭建ES6环境 前言 我们查阅资料可以知道ECMAScript 2015(简称ES6)已经于2015年发布,由于用户使用的浏览器版本在安装的时候可能早于ES6的发布,而到了今天 ...

随机推荐

  1. TCP的连接(三次握手)和释放(四次挥手)

    1 http都设置哪些header? http协议规定:一个完整的客户端发送给服务端的HTTP请求包括: (1)请求行:包括了请求方法.请求资源路径.HTTP协议版本,eg:GET/Server/im ...

  2. [ubuntu]对指定区域截图

    ctrl+shift 鼠标变成正十字. 按住右键就可以随意截图了. 设置方法: 打开系统设置面板 system settings --> keyboard -->  shortcuts - ...

  3. NYOJ 832 DP

    合并游戏 时间限制:1000 ms  |  内存限制:65535 KB 难度:4   描述 大家都知道Yougth除了热爱编程之外,他还有一个爱好就是喜欢玩. 某天在河边玩耍的时候,他发现了一种神奇的 ...

  4. footer点击添加active class

    //footer点击添加active class var indexFooter= document.querySelectorAll('#index_footer li'); for (var i ...

  5. 耐心排序Patience Sorting

    这个排序的关键在建桶和入桶规则上 建桶规则:如果没有桶,新建一个桶;如果不符合入桶规则那么新建一个桶 入桶规则:只要比桶里最上边的数字小即可入桶,如果有多个桶可入,那么按照从左到右的顺序入桶即可 举个 ...

  6. mysql 数据库备份与还原,用户的创建与删除,用户的密码修改

    1.备份数据库 要退出mysql rimideiMac-23:~ rimi$    mysqldump -u root -p pro >pro.sql ls 查看路径 2.恢复数据库 2.1直接 ...

  7. 【BZOJ4516】【SDOI2016】生成魔咒 [SAM]

    生成魔咒 Time Limit: 10 Sec  Memory Limit: 128 MB[Submit][Status][Discuss] Description 魔咒串由许多魔咒字符组成,魔咒字符 ...

  8. 01-QQ 3-最终重构版 Demo示例程序源代码

      源代码下载链接:01-QQ 3.zip292.5 KB // QQAppDelegate.h Map // //  QQAppDelegate.h //  01-QQ // //  Created ...

  9. 纠结于arch+xfce还是xubuntu

    现在用的是ubuntu gnome版 http://www.tuicool.com/articles/6r22eyU 现在纠结于arch+xfce还是xubuntu,因为不想在gnome下面搞什么美化 ...

  10. 一个基于时间注入的perl小脚本

    use strict; use warnings; use LWP::Simple; my %table_and_leng; ;;$count++){ #print "Test Table: ...