vue3+vite+ts打包时遇到的问题以及“优化”，JavaScript heap out of memory（错误：内存不足）等

vue3+vite+ts打包时报错
Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

解决办法：

1.yarn add increase-memory-limit cross-env --dev
2.在package.json的script中添加："fix-memory-limit":"cross-env LIMIT=4096 increase-memory-limit" （这是4G的，如果不行可以把4096改成8192）
3.yarn run fix-memory-limit
4.yarn build
1
2
3
4

之后的打包还爆内存不足的错误就继续先yarn run fix-memory-limit 再yarn build 这样可以了

如果用了element plus可能打包会出现这个报错
在tsconfig.json里加这代码就行

"compilerOptions": {
	"skipLibCheck": true,//针对element plus校验
}
1
2
3

如果打完包遇到这个提示，包块的大小超过了限制

在vite.config.ts里添加这些进行优化

build: {
  sourcemap: false,
  minify: 'terser',
  chunkSizeWarningLimit: 1500,
  terserOptions: {
    compress: {
      drop_console: true,
      drop_debugger: true
    }
  },
  rollupOptions: {
    output: {
      manualChunks(id) {
        if (id.includes('node_modules')) {
          return id
            .toString()
            .split('node_modules/')[1]
            .split('/')[0]
            .toString();
        }
      },
      chunkFileNames: (chunkInfo) => {
        const facadeModuleId = chunkInfo.facadeModuleId
          ? chunkInfo.facadeModuleId.split('/')
          : [];
        const fileName =
          facadeModuleId[facadeModuleId.length - 2] || '[name]';
        return `js/${fileName}/[name].[hash].js`;
      }
    }
  }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32