gulp 编译es6 探究
1.gulp配置:
var gulp = require('gulp')
var fs = require("fs")
var babelify = require('babelify')
var browserify = require('browserify')
var rename=require('gulp-rename')
var uglifyjs = require('gulp-uglifyjs')
gulp.task('es2015', () => {
	browserify("./src/main.js")
		.transform(["babelify", {
			babelrc: false,
			presets: ['es2015', 'es2016', 'es2017', 'stage-0'],
			plugins: ['transform-decorators-legacy']
		}])
		.bundle()
		.pipe(fs.createWriteStream("bundle.js"));
})
gulp.task('uglifyjs',()=>{
	gulp.src('./bundle.js')
		.pipe(uglifyjs())
		.pipe(rename('bundle.min.js'))
		.pipe(gulp.dest('./dist'))
})
gulp.task('default', () => {
	gulp.watch('./src/**/*.js', () => {
		gulp.run('es2015')
	})
})
这里编译es6的要点工具是babel和browserify,browserify是一个打包module模块的工具,能够将import之类的module打包进来到文件中。另外browserify还配置了babel模块来编译es6,这样就可以高度实现对es6的编译和打包。
gulp 编译es6 探究的更多相关文章
- gulp 编译es6 react 教程 案例 配置
		
1.gulp基本配置: var gulp = require('gulp'), watch = require('gulp-watch'), babel = require('gulp-babel') ...
 - 使用gulp和bable实现实时编译ES6代码
		
这篇文章最初发表在我自己折腾的博客站点上:使用gulp和bable实现实时编译ES6代码,该博客用了一位前辈开源的源码,基于thinkjs和vuejs开发,欢迎大家来逛逛. 问题描述> 项目开发 ...
 - gulp打包js多个文件夹并压缩混淆,编译ES6语法,及多个import依赖由一个入口打包成一个cdn
		
感觉和webpack的步骤差不多 首先安装gulp:参考上一篇 安装完之后 新建一个文件目录起名 在当前目录下打开cmd 执行:npm init 创建package.json文件 然后安装第一个插件g ...
 - 使用babel编译es6
		
起因:开发中慢慢的学习使用es6,但是JavaScript需要浏览器来解析,而不是所有浏览器都支持es6,所以为了兼容es6,需要第三方工具进行编译es6. 工具:node,gulp,gulp-bab ...
 - guulp配置编译ES6
		
下面是gulp的配置文件,gulp具体使用点击查看 首先全局安装下 cnpm install gulp -g gulpfile.js gulp配置文件 var gulp = require(&quo ...
 - 使用gulp 进行ES6开发
		
使用gulp 进行ES6开发 一.新建项目 项目结构如下: /app -- /js -- /css /dist -- /js -- /css -- index.html gulpfile.js 我们的 ...
 - laravel 中 与前端的一些事2  之使用Gulp编译sass
		
下载所有依赖npm的packagist: 下载了前端laravel elixir编译所需要的全部工具: gulp编译scss文件: scss文件的默认存放位置: 输入命令gulp 开始编译scss文 ...
 - vue 2.0 无法编译ES6语法
		
# vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...
 - 使用gulp编译sass
		
之前写了一篇在ruby环境下如何编译sass的文章:<css预处理器sass使用教程(多图预警)>,随着现在前端构建工具的兴起,也学着使用这些工具来编译sass.webpack存在一个CS ...
 
随机推荐
- 在浏览器中输入url回车之后会发生什么
			
在浏览器中输入URL之后,浏览器会经历以下5个步骤: 1.解析URL 2.DNS域名解析 3.浏览器与网站建立TCP链接(三次握手) 4.请求和传输数据 5.浏览器渲染页面 一.解析URL 什么是ur ...
 - ipset可使iptables一次性封多个ip
			
ipset是什么? ipset是iptables的扩展,它允许你创建 匹配整个地址集合的规则.而不像普通的iptables链只能单IP匹配, ip集合存储在带索引的数据结构中,这种结构即时集合比较大也 ...
 - ElasticeSearch(五)分布式索引架构
			
关于分布式架构 首先将ES默认每个索引是5个分片,这样做得目的是两个一个索引的时候速度更快(将数据写到小分片的尾部比写入大分片尾部更加快):另外一个是当数据量达到一定程度之后,分片查询,在汇总(sca ...
 - 禁止ajax访问shiro管理的登录页面
			
在使用shiro的时候,对于用户权限的管理,相信很多人都已经很熟悉了.今天,我这里简单的记录一下我自己调试过程中遇到的问题.主要是登录的操作,禁止通过ajax的方式进行访问. shiro中,登录过程拒 ...
 - SDRAM单字写操作
			
SDRAM单字写操作 1.单字写操作时序 2.写verilog程序体会 在初始状态,先写好跳转条件.If()....else... 3.通过仿顺序操作来实现连续写操作 首先完成单字写操作,然后跳转到下 ...
 - innobackupex
			
time innobackupex --defaults-file=/data/mysql/3306/my.cnf --user=root --password=123456 \--rsync --p ...
 - camera-arm-RPI
			
这个属于先收藏着,知道有个开源的东西. luvcview是一个开源项目,专注于UVC摄像头的测试,只要您的摄像头支持UVC驱动,即可使用luvcview测试程序,如何知道自己的摄像头是不是支持UVC驱 ...
 - 坑人的 Javascript 模块化编程 require.js
			
坑人的 Javascript 模块化编程 require.js
 - Scrapy环境安装
			
开始安装前,建议安装Visual C++ 2015 Build Tools,否则会一直出现如下提示: 下载地址:http://landinghub.visualstudio.com/visual-cp ...
 - Django--ORM--模型增删改查--备忘
			
以上运算符都区分大小写,在这些运算符前加上i表示不区分大小写,如iexact.icontains.istartswith.iendswith.insert into tb_bookinfo()valu ...