javascript - VueJS忽略全局导入

Question

我正在尝试.less在我的文件中导入一个文件，App.vue以便其内容可用于所有组件。

我创建这样的示例应用程序：

vue create less_test

然后我安装lessnpm 包

cd less_test
npm install less less-loader --save-dev

我创建了这个简单less的文件src/

_variables.less

//  Colors
@yellowish: #E19525;

然后在HelloWorld.vue我将其更改<style>为：

<style lang="less" scoped>
.hello {
  background-color: @yellowish;
}
...
</style>

在App.vue上：

<style lang="less">
@import "_variables.less";
...
</style>

但是当我尝试构建时，我收到了这个错误：

.hello {
  background-color: @yellowish;
                  ^
Variable @yellowish is undefined

如何导入全局.less文件而不必在每个组件上导入它？

标签： javascriptvue.jswebpackless

Answer 1

我只是<style src="@/path/to/_variables.less" lang="scss"></style>在我的 App.vue 中添加了一个。