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. tinyxml源码解析(上)

    转载于:http://www.cnblogs.com/marchtea/archive/2012/11/09/2762669.html 前言: 前段时间做功能可行性的时候简单的使用了tinyxml.在 ...

  2. SCU 4527 NightMare2 最短路+二分 好题

    可怜的又做噩梦了..但是这次跟上次不大一样,虽然他又被困在迷宫里,又被装上了一个定时炸弹,但是值得高兴的是,他发现他身边有数不清的财宝,所以他如果能带着这些财宝并活着逃出去的话,他就发财啦.不过,这次 ...

  3. springboot初学

    首先苦于用ssh.ssm来搭建一个项目,这个基础搭建工作就大概要用半天的功夫才能弄好,想到就头疼,后面听了实验室一位大神的建议,用springboot啊,简单的不止一点点.就顺便学习了下这个神器,果然 ...

  4. linux用户管理和文件权限

    linux用户管理和文件权限 新建用户:useradd ftpuser      useradd -g gxx userxx修改密码:passwd ftpuser新增用户组:# groupadd gr ...

  5. 可以随时拿取spring容器中Bean的工具类

    前言 在Spring帮我们管理bean后,编写一些工具类的时候需要从容器中拿到一些对象来做一些操作,比如字典缓存工具类,在没有找到字典缓存时,需要dao对象从数据库load一次,再次存入缓存中.此时需 ...

  6. 函数式编程--响应式编程 ---android应用例子

    RxJava implements this operator as create. It is good practice to check the observer’s isUnsubscribe ...

  7. 洛谷P2901 [USACO08MAR]牛慢跑Cow Jogging

    题目描述 Bessie has taken heed of the evils of sloth and has decided to get fit by jogging from the barn ...

  8. bzoj 1914: [Usaco2010 OPen]Triangle Counting 数三角形——极角排序

    Description 在一只大灰狼偷偷潜入Farmer Don的牛群被群牛发现后,贝西现在不得不履行着她站岗的职责.从她的守卫塔向下瞭望简直就是一件烦透了的事情.她决定做一些开发智力的小练习,防止她 ...

  9. UIPikerView的属性---iOS-Apple苹果官方文档翻译

    本系列所有开发文档翻译链接地址:iOS7开发-Apple苹果iPhone开发Xcode官方文档翻译PDF下载地址  //转载请注明出处--本文永久链接:http://www.cnblogs.com/C ...

  10. 大聊Python----多线程

    Python里的多线程是假的多线程,不管有多少核,同一时间只能在一个核中进行操作!利用Python的多线程,只是利用CPU上下文切换的优势,看上去像是并发,其实只是个单线程,所以说他是假的单线程. 那 ...