以前都是裝了 Ruby 后用命令行編譯 Sass 的,感覺太 Low,所以最近剛切換到 Grunt(還是很 Low 嘛,好吧……),想以此實現(xiàn)自動化編譯被修改的 Sass 文件。Grunt package.json 內(nèi)容如下:{
????"name":?"grunt?sass?demo",
????"version":?"1.0.0",
????"devDependencies":?{
????????"grunt":?"*",
????????"grunt-contrib-watch":?"*",
????????"grunt-contrib-sass":?"*"?
????}
}Gruntfile.js 內(nèi)容如下:module.exports?=?function(grunt)?{
????grunt.initConfig({
????????pkg:?grunt.file.readJSON('package.json'),
????????meta:?{
????????????basePath:?'../',
????????????srcPath:?'../assets/sass/',??//?源碼
????????????deployPath:?'../assets/css/'??//?編譯輸出
????????},
????????banner:?'/*!?<%=?pkg.name?%>?-?v<%=?pkg.version?%>?-?'?+?
????????????????'<%=?grunt.template.today("yyyy-mm-dd")?%>\n'?+?
????????????????'*?Copyright?(c)?<%=?grunt.template.today("yyyy")?%>?',
????????sass:?{
????????????dist:?{
????????????????options:?{
????????????????????sourcemap:?'auto',
????????????????????style:?'compressed'
????????????????},
????????????????
????????????????//?這樣寫不起作用
????????????????//?files:?{
????????????????//??src:?'<%=?meta.srcPath?%>*.scss',
????????????????//??dest:?'<%=?meta.deployPath?%>*.css'
????????????????//?}
????????????????
????????????????//?這樣只能編譯特定的文件
????????????????//?files:?{
????????????????//??'<%=?meta.deployPath?%>test1.css':?'<%=?meta.srcPath?%>test1.scss'
????????????????//?}
????????????????//?使用字典匹配
????????????????files:?[{
????????????????????expand:?true,
????????????????????cwd:?'<%=?meta.srcPath?%>',
????????????????????src:?['*.scss'],
????????????????????dest:?'<%=?meta.deployPath?%>',
????????????????????ext:?'.css'
????????????????}]
????????????}
????????},
????????watch:?{
????????????scripts:?{
????????????????files:?['<%=?meta.srcPath?%>*.scss'],
????????????????tasks:?['sass:dist']
????????????}
????????}
????});
????grunt.loadNpmTasks('grunt-contrib-sass');
????grunt.loadNpmTasks('grunt-contrib-watch');
};然后運行 grunt watch 開啟監(jiān)視模式,當(dāng)我修改?srcPath/sass/ 下的任一個 Sass 文件時,當(dāng)前整個目錄下的 Sass 文件都會被編譯,請問如何設(shè)置才能只編譯當(dāng)前改動的文件?
添加回答
舉報
0/150
提交
取消