摇树 sass

Question

我有一个包含许多旧/未使用的 SCSS 文件的大型项目。有什么方法可以使用node-sass或libsass来摇动或删除编译中未使用的所有文件？

或者有没有办法简单地输出编译中使用的所有文件的列表，以便我可以交叉引用？

编辑：虽然似乎有解决方案可以从sass 构建的输出中删除未使用的样式，但我仍然没有看到一种有效的方法来删除未使用的输入文件

Answer 1

使用 sass，如果您将:line_comments选项设置为 true，则生成的输出将包含定义每个规则的行号和源文件。你应该得到如下输出：

/* line 20, sass/_reset.sass */
body {
  line-height: 1;
  color: black;
  background: white;
}

使用 node-sass 选项是sourceComments: true.

gulp.task('styles', function() {
    return gulp.src('src/sass/**/*.scss')
    .pipe(sass({ 
        style: 'expanded',
        sourceComments: true
    }))
    .pipe(gulp.dest('path/to/file.css'))

所以做这样的事情，然后你可以这样做：

grep '^/\* line \d*, .*\*/' path/to/file.css

你会得到如下输出：

path/to/file.css:/* line 20, sass/_reset.sass */

然后您只需编写一些脚本来删除未出现在该列表中的文件。