我如何在Nuxt项目中全局使用sass？

Question

我有一个Vue.js组件，我想从我的scss文件访问我的sass变量。在NUXT文档https://nuxtjs.org/faq/pre-processors/中，您可以使用节点sass和sass-loader来执行此操作。所以我都安装了这两个程序，它们都在我package.json中的dev依赖项下。

之后，我将以下内容添加到我的nuxt.config.js中

  css: [
    '@/assets/sass/main.scss'
  ],

但是当我尝试在其中一个组件中执行此操作时

<style lang="scss">
html, body{
    background-color: $background-color;
    overflow: hidden;
}
</style>

我收到$ background颜色未定义的错误？为什么会这样？

我的main.scss位于资产/资产中

$text-color:#FFFFFF;
$background-color: #FFFFFF;
$primary-color: #1F2338;
$secondary-color: #F73455;

$navigation-opacity: 0.70;

Answer 1

在Github上查看此内容。我按照说明进行了操作。

https://github.com/nuxt-community/style-resources-module/