使用 nuxtjs-vuetify 全局加载 main.sass

Question

我正在开发 nuxt-vuetify-app

我想全局加载我的 main.scss 文件。

这是我的 package.json

{
"name": "marketectm",
"version": "1.0.0",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate"
},
"dependencies": {
"@nuxtjs/axios": "^5.12.2",
"core-js": "^3.6.5",
"nuxt": "^2.14.6"
},
"devDependencies": {
 "@nuxtjs/vuetify": "^1.11.2",
 "fibers": "^5.0.0",
 "sass": "^1.29.0",
 "sass-loader": "^10.1.0"
}

}

在 nuxt.config.json 中，我尝试了类似

  build: {
   loaders: {
     scss: {
      prependData: '@import "@/assets/main.scss';
  }
},

}

但是我的css的变化不影响。

我试过这个（允许文档）

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

但我有这个错误：

  Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
  ValidationError: Invalid options object. Sass Loader has been initialized using an options 
  object that does not match the API schema.
  - options has an unknown property 'prependData'. These properties are valid:
  object { implementation?, sassOptions?, additionalData?, sourceMap?, webpackImporter? }
  at validate (/Users/dariopres/Lavoro/nuxt-market/node_modules/sass- 
  loader/node_modules/schema-utils/dist/validate.js:104:11)
  at Object.loader (/Users/dariopres/Lavoro/nuxt-market/node_modules/sass- 
  loader/dist/index.js:30:29)

  @ ./assets/main.scss 4:14-215 14:3-18:5 15:22-223
  @ ./.nuxt/App.js
  @ ./.nuxt/index.js
  @ ./.nuxt/client.js
  @ multi ./node_modules/@nuxt/components/lib/installComponents.js eventsource-polyfill 
  webpack-hot-middleware/client? 
  reload=true&timeout=30000&ansiColors=&overlayStyles=&path=%2F__webpack_hmr%2Fclient&name=
  client 
  ./.nuxt/client.js

编辑

我找到了解决方案，我不得不将 sass-loader 降级到 7.3.1 然后简单地工作

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

Answer 1

我解决了将 sass-loader 降级到 @7.3.1 的问题，希望这可以帮助其他人；）