Vite2打包警告@charset规则

vite + vue3 + ts + sass 项目

编译 warning
"@charset" must be the first rule in the file\

由于我在 CSS 代码中使用了/* */ 结合中文注释的方式，导致 CSS 中文注释也被编译进了最终产物。

该警告并不会影响最终产品，如果不想看到的话可以使用以下几种方法。

解决方案
1、就是把/* */结合中文注释改用 //加中文注释。
2、还可以在 vite.config.ts 中添加以下代码可以解决。

  css: {
    postcss: {
      plugins: [
          {
            postcssPlugin: 'internal:charset-removal',
            AtRule: {
              charset: (atRule) => {
                if (atRule.name === 'charset') {
                  atRule.remove();
                }
              }
            }
          }
      ]
    }
  }，

3、由于我使用的sass，可以配置sass的charset:false,也可以解决@charset警告问题。

css: {
    preprocessorOptions:{
      scss:{
        charset:false
      }
    }
 },

最后附上我的参考链接 Warning @charset rule when using yarn build