gulp-uncss 删除使用 javascript 添加的 class

Question

我的 gulp gulp-uncss 配置是

gulp.task('uncssme', function () {

return gulp.src('src/css/**/*.css')
    .pipe(uncss({
        html: ['src/**/*.html']
    }))
    .pipe(gulp.dest('dist/css'))
});

使用 uncss 从最终 css 文件中删除 'newClass' 选择器，因为 class 不直接用于 .html 文件，而是通过动态添加js.

document.getElementById('good').className += ' newClass';

编辑：我已经在使用 /* uncss:ignore */ 来使其工作，但是对于 .js 中存在但不存在于 .html[ 中的 class 每次都添加此注释是没有意义的=15=]

Answer 1

我在使用 Uncss 时遇到了同样的问题，唯一的方法是使用忽略注释，我认为这不是很好的解决方案。

我建议您尝试 purifycss 插件 (https://www.npmjs.com/package/gulp-purifycss/)。您可以同时设置 html 和 js 文件，然后将 css 取消 css-ed 或 purify-ed，这就是我遇到问题时正在寻找的内容。

Answer 2

也许，您可以仅在 js 宽度 is- 中使用每个 class 前缀，并在 gulp 任务中添加带有正则表达式的忽略选项。

gulp.task('uncssme', function () {

return gulp.src('src/css/**/*.css')
    .pipe(uncss({
        html: ['src/**/*.html'],
        ignore: [^\.is-.*]
    }))
    .pipe(gulp.dest('dist/css'))
});

gulp-uncss 删除使用 javascript 添加的 class

gulp-uncss removes class which is added using javascript

html

javascript

css

gulp

gulp-uncss