首页 > 代码库 > boostraps+jekyll+sass/scss+less+grunt整合使用详细备忘
boostraps+jekyll+sass/scss+less+grunt整合使用详细备忘
2014-08-25
http://www.w3cplus.com/preprocessor/nodejs-and-grunt-compile-sass-to-css.html
安装grunt sass支持,包含grunt watch
boostraps的Gruntfile.js,package.json,直接考到新建的项目目录调整使用,运行npm install 安装依赖包,可以删减不必要的
A.整合方法
1.https://github.com/gruntjs/grunt-contrib-sass 先从这里查看安装方法,是一个官方实例,下载好后,可以进入对应目录调试,
2.安装完成后,进入这个目录,copy2个文件到,jekyll的根目录,分别是 package.json 和 Gruntfile.js
3.package.json 里面包含了一些需要转换sass用到的依赖包,Gruntfile.js 是配置文件;
4.安装依赖包的,命令是:npm install 会自动安装;
5.完成后,执行命令。grunt sass
sass为插件指定的任务名字,一般不能改动,如果要改动,要去到插件对应目录,找到sass.js修改
6.监听文件改动插件为 grunt-contrib-watch
代码片段,要加入Gruntfile.js ,作为其中一个任务
watch: {
scripts: {
files: [
‘<%= meta.srcPath %>/**/*.scss‘
],
tasks: [‘sass‘]
}
}
7.less的支持类似,https://github.com/gruntjs/grunt-contrib-less 步骤查看
进入项目根目录运行: npm install grunt-contrib-less --save-dev
bootstraps的Gruntfile.js 配置文件有实例,可拿过来修改用
boostraps+jekyll+sass/scss+less+grunt整合使用详细备忘
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。