背景
在我们新开始的项目中,我们打算使用scss来作为我们的样式书写语言。同时,所有的sass/scss文件经过编译转化成css文件后要存放到跟scss/sass文件相同的目录下。整个前端团队已经有实时的代码编译构建工具,那么我们只需要书写自己的实时scss/sass构建工具,生成对应的css文件后,团队的实时构建工具也会触发编译,做打包构建处理。
第三方包选型
基于gulp的sass/scss编译工具有:基于node-sass的
gulp-sass以及基于Ruby的
gulp-ruby-sass。但是为了免得再安装Ruby以及一些特定的原因(
gulp-ruby-sass与gulp-sass),我选择了使用gulp-sass。
运行方式及运行效果
你需要全局安装gulp:npm install -g gulp,你需要在你项目的根目录下新建gulpfile.js文件。运行方式就是直接在命令行项目根目录下执行:gulp即可。编译成功后会给出编译成功的提示(当然也可以配置关闭该提示),编译失败则会给出编译失败的提示,并且会在命令行控