vue.js：始终在每个vue样式部分中加载settings.scss文件
我发现自己在每个.vue文件中都重复了相同的模式，以便使用变量等：
<style lang="scss">
@import "../styles/settings.scss";
.someclass { color: $some-variable; }
</style>
或者如果它嵌套在一个文件夹中，我必须记住要谨慎对待路径：
<style lang="scss">
@import "../../styles/settings.scss";
</style>
有没有一种方法可以在settings.scss我创建的每个.vue文件中全局导入该文件？我看了看文档却没有看到，但是也许我错过了，或者这是我需要利用webpack来做的事情吗？
第1321篇《vue.js：始终在每个vue样式部分中加载settings.scss文件》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点
如果将所有组件存储在同一目录中，则settings.scss的路径将始终保持不变。
这是webpack所需的功能。原则是使全局变量越少越好，只包含所需的内容，使项目精简，高效且易于推理。
也许您应该重组您的组件/样式，以使每个Vue组件中没有太多自定义样式（构建自己的引导程序？），因此您不必在每个Vue组件中都包含特定的样式表。
这并不能真正回答您的问题，但是可以指导您与选择使用的工具背后的原理保持一致。
祝你好运！
我认为您正在使用webpack？您可以settings.scss在app.js文件中要求该文件，如下所示
require("!style!css!sass!./file.scss");
因此，在编译时。您所有的组件都会得到它。您不必每个都要求它。
自从我问了这个问题以来，官方文档已经更新：https : //vue-loader.vuejs.org/en/configurations/pre-processors.html
对于其他在2017年及以后观看此内容的人，请查看“加载全局设置文件”下的说明。
相似问题
问题类别
到过那里-不幸的是，如果不将文件导入每个组件中，则无法执行此操作。为了解决这个问题，您可以尝试使用创建辅助类，
color: $some-variable并且background-color: $some-variable该辅助类可以涵盖您的一些用例。如果确实要在每个文件中导入文件，请确保该文件仅包含变量。您不想多次包含样式规则。
否则，我将为
.scss每个组件创建单独的文件。您仍然可以将.vue模板用于html和js，但要保持样式分开。这可能是最有效的方法。