nuxt 2.8 中的全局 SCSS mixins

【问题标题】：Global SCSS mixins in nuxt 2.8nuxt 2.8 中的全局 SCSS mixins
【发布时间】：2019-12-20 14:08:53
【问题描述】：

nuxt.config.ts：

  /*
   ** Global CSS
   */
  css: [
    '@/assets/scss/global.scss'
  ],

global.scss 中的混合：

@mixin grid($flex) {
    @if $flex {
        @include flex;
    } @else {
        display: block;
    }
}

然后，如果我尝试在组件的 scss 中使用此 mixin - 它会引发有关缺少 mixin 的错误。有没有办法在 nuxt 中使用全局 mixins/变量？

【问题讨论】：

【解决方案1】：

要使用 mixin，您应该在您尝试使用 mixin 的 scss 文件中 @importmixin 文件。

您可以使用 sass-resources-loader 全局导入您的 mixin（和/或变量）有关更多信息，请查看我的回答 here

【讨论】：