参考：

https://github.com/IndexXuan/vue-cli-plugin-vite

  1. vue add vite 安装插件vue-cli-plugin-vite
  2. 省略.vue的引入报错了

踩坑记录

Could not resolve “setimmediate”

hui依赖setimmediate ，安装ni setimmediate

Error: Can’t find stylesheet to import

@import ‘~hui/packages/theme/common/var-common.scss’;

https://github.com/vitejs/vite/issues/5764
sass 不支持 波浪线

  1.    alias: [
  2.       {
  3.         find: /^~/,
  4.         replacement: "",
  5.       },

The requested module ‘/node_modules/.pnpm/qs@6.11.0/node_modules/qs/lib/index.js?v=e039ddcb’ does not provide an export named ‘default’

引入 @originjs/vite-plugin-CommonJS

Uncaught Error: Module “util” has been externalized for browser compatibility. Cannot access “util.custom” in client code.

https://stackoverflow.com/questions/69286329/polyfill-node-os-module-with-vite-rollup-js/70666018#70666018

  1. import { fileURLToPath, URL } from "node:url";
  3. import { defineConfig } from "vite";
  4. import legacy from "@vitejs/plugin-legacy";
  5. import vue2 from "@vitejs/plugin-vue2";
  6. import vue2Jsx from "@vitejs/plugin-vue2-jsx";
  7. import { viteCommonjs } from "@originjs/vite-plugin-commonjs";
  8. import rollupNodePolyFill from "rollup-plugin-node-polyfills";
  9. // https://vitejs.dev/config/
  10. export default defineConfig({
  11.   plugins: [
  12.     vue2(),
  13.     vue2Jsx(),
  14.     legacy({
  15.       targets: ["ie >= 11"],
  16.       additionalLegacyPolyfills: ["regenerator-runtime/runtime"],
  17.     }),
  18.     viteCommonjs(),
  19.   ],
  20.   resolve: {
  21.     alias: [
  22.       {
  23.         find: /^~/,
  24.         replacement: "",
  25.       },
  26.       {
  27.         find: "@",
  28.         replacement: fileURLToPath(new URL("./src", import.meta.url)),
  29.       },
  30.       {
  31.         find: "util",
  32.         replacement: "rollup-plugin-node-polyfills/polyfills/util",
  33.       },
  34.     ],
  35.   },
  36.   optimizeDeps: {
  37.     // Vite does not work well with optionnal dependencies,
  38.     // mark them as ignored for now
  39.   },
  40.   preprocessorOptions: {},
  41.   build: {
  42.     rollupOptions: {
  43.       plugins: [
  44.         // Enable rollup polyfills plugin, used during production bundling
  45.         rollupNodePolyFill(),
  46.       ],
  47.     },
  48.   },
  49. });

Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.

sass 版本 降为 “sass”: “~1.32.12”,

Undefined function. ╷ 10 │ $rgb: math.div

1.33.0 之后才能用

—- 没办法 还是用新版本吧