如何在多个文件夹执行青菜watch命令

问题描述：

src/ 
    sass/ 
     base.scss 
     global.scss 
    components/ 
     Menu/ 
      sass/ 
       styles.scss 
     Contents/ 
      sass/ 
       style.scss

正如你可以看到我有global风格和样式每个组件。我现在正在做的是编辑global样式，然后在全局样式文件夹上运行sass --watch sass:css。当我编辑任何组件样式时，我在该组件的sass文件夹上运行sass --watch sass:css命令。

我需要的是运行sass --watch命令，以便它编译我正在编辑的所有scss文件。 我该如何做这项工作？

答

首先我强烈建议使用Compass编译您的scss文件。使用它按照此链接中的步骤： Install Compass-style

后，安装在你的src文件夹中创建一个项目文件 config.rb 后去src文件夹，然后运行：

compass watch

它会编译所有的scss文件

你可以指定很多set婷 config.rb的内容应该是这个样子

require 'compass/import-once/activate' 
# Require any additional compass plugins here. 

# Set this to the root of your project when deployed: 

http_path = "/" 
css_dir = "../wwwroot/css" 
sass_dir = "./" 
images_dir = "/wwwroot/images" 
cache_path = "c:/tempscss"

您可以检查此链接了解更多关于什么可以配置 Compass Configuration

答

你能不能考虑使用构建工具如咕嘟咕嘟或蛮兵？这会让事情变得更容易。您可以使用通配符，如'./src/sass/**/*.scss'或['./src/components/scss/*.scss', './src/modules/**/*.scss']

设置在一饮而尽只是

var gulp = require('gulp'); 
var sass = require('gulp-sass'); 

gulp.task('styles', function() { 
    gulp.src('./src/sass/**/*.scss') 
     .pipe(gulp.dest('./dist/css/')) 
}); 

gulp.task('watch',function() { 
    gulp.watch('./src/sass/**/*.scss', ['styles']); 
});

只有随着新公共管理目标的多个文件夹，它可能是这样的：

"scripts": { 
    "watch:sass": "onchange 'src/scss/**/*.scss' -- npm run sass:css", 
}

在这里找到更多的信息https://github.com/Qard/onchange

如何在多个文件夹执行青菜watch命令

相关推荐