用Gulp创建coffeeScript,jade,sass为基础的自编译自刷新工作流
最近接触了自动化工具Gulp(什么是Gulp?),并用他为自己写了以jade, sass ,coffeeScript为预编译的自动编译与刷新的工作流。“工具的作用是提高生产效率”,当我运用自动化工具,才知道原来还有这么好的东西。(想到刚开始一个一个的解析sass。。捂脸)
前提
- 已安装npm(还没安装?点这里)
需要的Gulp插件
- gulp-sass :编译sass文件为css文件链接描述(什么是sass?)
- gulp-jade :编译jade文件为HTML文件(什么是jade?)
- gulp-coffee:编译coffeeScript文件为js文件什么是coffeeScript?)
- browser-sync :浏览器同步测试工具
1.新建一个项目project
app存放预编译的代码,myBlog存放编译后的代码
创建package.json文件(用来保存项目相关信息)
$ project> npm init
2.在该项目下安装gulp
全局安装
$ project> npm install gulp -g
局部安装
$ project> npm install gulp --save-dev
3.安装所需的插件
$ project> npm install gulp-sass gulp-jade gulp-coffee browser-sync --save-dev
若有错误,你可以尝试一个一个的安装~
个个所需文件安装成功后的目录,node_nodeules为存放插件的地方
4.实例化插件
在目录下创建gulpfile.js(必须是这个名字,严肃脸)
5.创建gulp任务
$ project> gulp watch
6.工作流完成,让我们把注意力聚焦于编程本身,不再让那些编译刷新的重复性工作打断我们的思路.
点击查看更多内容
8人点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦