Vue 3/Vite/验证3构建错误：在@used模块中未使用！default声明变量

ddrv8njm 于 2023-01-17 发布在 Vue.js

关注(0)|答案(1)|浏览(702)

我尝试在Vue 3、Vuetify 3、Vite build中实现SASS变量，但遇到一个关于变量未使用! default声明的错误
我按照in the Vuetify 3 documentations的说明设置了SASS变量，并尝试为expansion panel active title height设置一个变量覆盖

// src/styles/settings.scss
@use 'vuetify/styles' with (
  $expansion-panel-active-title-min-height: 48px
)

// vite.config.ts
...
plugins: [
  vue(),
  vuetify({
     styles: { configFile: "src/styles/settings.scss" }
  })
]

我最初尝试使用@use 'vuetify/settings'的这些设置，但结果没有变化。
任何帮助我做错了什么将不胜感激，我不知道我是否错过了什么或如果只是误读了文件

vue.js

来源：https://stackoverflow.com/questions/74954251/vue3-vite-vuetify-3-build-error-variable-was-not-declared-with-default-in-the

1条答案

按热度按时间

olmpazwi1#

我也遇到过同样的问题，虽然是文档化的问题。我的解决方案是在“src/styles/settings”中做一个小改动：

// src/styles/settings.scss
@use 'vuetify/settings' with (
    // Place SASS variable overrides here
    $expansion-panel-active-title-min-height: 48px
    $font-size-root: 18px,
    $border-radius-root: 12px,
)

除此变更外，在“src/plugin/vuetify. js”中导入“vuetify/styles”也很重要：

...
import "vuetify/styles";
import "@/styles/fonts.scss";
// import "@/styles/settings.scss";
import "@/styles/main.scss";
import "@mdi/font/css/materialdesignicons.css";

import { createVuetify } from "vuetify";
...

“虚拟配置|ts”是相同的。

赞(0）回复(0）举报 2023-01-17

我来回答

Vue 3/Vite/验证3构建错误：在@used模块中未使用！default声明变量

1条答案

相关问题

热门标签

最新问答