在vue3+vite的应用中配置sass预处理器至src/app.vue.sass.config.js生成静态站点

一、安装步骤与操作指南

直接进入项目文件夹后执行npm安装操作，无需进行复杂的各项配置步骤

    npm install --save-dev sass
    
    
      
    

若已成功安装相关组件，但在使用vite启动项目时仍遇到错误提示，请仔细核查package.json文件中的依赖配置，确认sass是否被正确归类至开发依赖项中。如发现其位于常规依赖列表内，可将其迁移至开发依赖部分，此类问题通常源于安装sass时未通过npm命令添加–save-dev参数所致。

二、加入全局scss文件

进入vite的配置文件中，对其中的css相关设置进行添加和调整即可完成配置。

    cssPreprocessOptions: {
       scss: {
      additionalData: '@import "./src//scss/common.scss";' // 全局公共样式
       }
    }