Laravel-将自定义样式添加到现有的app.scss

Question

我是Laravel的新手，我已经阅读了关于Stackoverflow的其他一些有关向Laravel添加自定义样式的问题。

我创建一个新的stackoverflow问题的原因是因为Laravel似乎只编译了一个app.css，这也加载了引导程序。我认为这是通过运行npm run dev创建的，它会编译app.scss resources文件夹中的sass。

在给定的文件引导程序由@import '~bootstrap/scss/bootstrap';加载的情况下，我也想通过自己的自定义样式来遵循此原则，以便我能像@import '~mywebsite.css';

这样，我最终得到一个单个的.css文件，我认为它更加雄辩。

解决此问题的适当方法是什么？此外，正在导入的“引导程序”样式位于何处？我不明白'〜'的位置。

最后但并非最不重要的一点是，是否可以对app.js文件使用相同的方法？

非常感谢

• 查克

Answer 1

您可以在/ resources / sass中创建一个新的sass文件，例如_test.sass 并将导入文件放入app.sass中，如下所示：

@import 'test';

并使用npm run dev或npm run watch进行编译

如果需要在公用文件夹中创建一个新文件，则可以创建一个新的sass文件（example.sass），然后更改webpack.mix.js文件并放入新的CSS行 像这样：

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .sass('resources/sass/example.scss', 'public/css'); 

并使用npm run dev进行编译。

致谢！