Browsersync 和/或 Gulp 不断重置 CSS

Question

我有 Gulp 和 Browsersync 设置。但是，每当我运行 npm start 时，Style.css 文件中的 CSS 都会重置。 index.html 更改仍然存在，我可以轻松地将初始 CSS 更改推送到 github。有谁知道为什么要重新设置这些 CSS 添加以及我可以做些什么来阻止它发生？

https://github.com/jwolfe890/bootProj

Answer 1

您的项目设置为使用scss。这会被编译为正常的css。
如果您将代码直接写入 css 文件，则 gulp 作业只会重新编译 scss 并覆盖您的更改。
为了减少这种情况发生的可能性，约定是不要将 gulp 作业的输出写入您用于开发 (src) 的同一目录中。

gulp.task('sass', function(){
  return gulp.src(['node_modules/bootstrap/scss/bootstrap.scss','src/scss/*.scss'])
    .pipe(sass())
    .pipe(gulp.dest("src/css")) <-- put this somewhere else
    .pipe(browserSync.stream());
});

要解决您的问题，只需将您的样式写入scss 文件即可。