1

我无法让 Yeoman / Bower / Gulp 和 gulp-webapp 生成器自动编译对 Bootstrap _variables.scss 文件所做的 SASS 更改并重新加载。

基本上对该路径中的文件进行了更改：/bower_components/bootstrap-sass-official/assets/stylesheets/bootstrap/

我花了一些时间调整 gulpfile.js 并设法让自动重载来处理对上述路径中任何文件所做的更改；但是，它不会重新编译 sass 文件。重新编译的唯一方法是使用“gulp”命令，但这会适得其反。

几个小时后我被难住了，有人可以帮忙解释一下吗？

4

2 回答 2

1

根据设计，该项目设置为仅监视app/styles/目录及其子目录中您的个人样式文件的更改。

修改目录中的文件的想法/bower_components通常被认为是一种不好的做法。如果您不小心运行bower update，它将覆盖您对修改后的 bower 文件所做的所有更改。

相反，您可以使用 sass@import将引导.scss文件main.scss从/bower_components. 然后你可以使用这些sass 变量重新定义你想要的所有样式

于 2015-03-31T22:52:23.490 回答
0

我找到了解决方案。不确定这是否是最好的方法，但它确实有效。

在代码的 gulp.watch 部分（第 98 行）

gulp.watch('app/styles/**/*.scss', ['styles']);
gulp.watch('app/fonts/**/*', ['fonts']);
gulp.watch('bower.json', ['wiredep', 'fonts']);

我复制了第一行，只是添加了 Bootstrap .scss 文件的路径。

gulp.watch('app/styles/**/*.scss', ['styles']);
gulp.watch('bower_components/bootstrap-sass-official/assets/stylesheets/bootstrap/**/*.scss', ['styles']);
gulp.watch('app/fonts/**/*', ['fonts']);

现在，每当我更改 _variables.scss 文件中的 $btn-default-bg 时，它都会自动重新编译。

我的想法是我可以将 _[name].scss 添加到原始 Bootstrap SASS 列表中，它将包含在分布式版本中。

于 2015-03-31T22:44:59.640 回答