VUE里直接设置全局样式

佛门与网络

IT教程吧的吧友们好，今天给大家介绍两种方法：1、自然是直接在main.js里直接用import导入具体的css（含less、sass等）文件即可，这样所有的vue组件都有了这个公共样式
2、也很简单是用webpack实现的，向预处理器Loader传递选项
使用 vue.config.js 中的 css.loaderOptions 选项。示例：

1. module.exports = {
   
2.   css: {
   
3.     loaderOptions: {
   
4.       sass: {
   
5.         data: `
   
6.           @import "@/styles/mixin.scss";
   
7.           @import "@/styles/variables.scss";
   
8.         `
   
9.       }
   
10.     }
    
11.   },
    
12. }

复制代码

这样vue文件里css就不用再导入样式文件了