需求描述

在vue中引入全局css可以直接在html页面引入.css文件，但sass/scss必须被解析成css才能真正引入到页面，因此必须在vue.config.js中配置全局的.sass/.scss文件

vue3配置全局sass/scss

根据vue-cli官网最新的关于css.loaderOptions的配置文档：

尝试了网络上许多教程没有出来，关键就是这个配置项名称：additionalData；可能当你看到时，官网文档已不再是这个字段。。如果配置无效了，请点击参考文档的第一条到官网查阅最新配置信息，一切以官网为准！

// vue.config.js
module.exports = {
  css: {
    loaderOptions: {
      scss: { // 如果配置为"additionalData"无效，请到官网查阅最新配置信息
        additionalData: `
          @import "~@/assets/放在assets目录下你的.sass/.scss文件1";
          @import "~@/assets/放在assets目录下你的.sass/.scss文件2";
        `
      }
    }
  }
};

其他

vue配置html网页显示的title：htmlWebpackPlugin.options.title

参考文档

[1] vue-cli：css.loaderOptions
[2] vue-cli：修改插件选项
[3] scss基础使用