使用vue-cli-3的全局共享变量vue.js

Question

我在src / style / base.scss下有一个base.scss。该文件具有所有变量和混入文件的导入。

当我使用vue-cli-3服务项目时，它说未知变量$ black。

为解决此问题，我引用了此https://cli.vuejs.org/guide/css.html#passing-options-to-pre-processor-loaders并添加了

module.exports = {
    css: {
        loaderOptions: {
            sass: {
                data: '@import "@/style/base.scss";'
            }
        }
    }
}

到我的vue.config.js

它解决了上一个问题，但是我的图标是通过

中的v-icon导入和使用的

<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Material+Icons'>

无法解决（显示文本而不是图标），甚至无法使用

导入样式

import 'vuetify/dist/vuetify.min.css'

不起作用。

我如何使vuetify和图标导入工作？

Answer 1

解决了该问题。它正在导入，但在vuetify之后加载了reset.css，这反过来又覆盖了样式。

在index.html的开头调用了reset.css。