//app.vue
<el-config-provider namespace="ep">
</el-config-provider>
//style/element/index.scss
@forward "element-plus/theme-chalk/src/mixins/config.scss" with (
$namespace: "ep"
);
//vue.config.ts
css: {
// css预处理器
preprocessorOptions: {
scss: {
// 引入 var.scss 这样就可以在全局中使用 var.scss中预定义的变量了
// 给导入的路径最后加上 ;
additionalData: `@use "@/style/element/index.scss" as *;`,
}
}
},
以上是按照element-plus文档中写的,但是并未如愿,通过查阅一些资料,在vue.config.ts中还需要配置以下内容才生效:
Components({
// allow auto load markdown components under `./src/components/`
extensions: ['vue', 'md'],
// allow auto import and register components used in markdown
include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
resolvers: [
ElementPlusResolver({
importStyle: 'sass',
}),
],
dts: 'src/components.d.ts',
}),