前端(Quasar/vite)打包内存溢出

为了不污染代码库,我的项目是线上打包的,之前一直都挺好的,但今天推了一版上去后打包就内存溢出了。

<--- Last few GCs --->
[127:0x56098b0]    64992 ms: Mark-sweep (reduce) 1494.8 (1525.3) -> 1494.1 (1526.1) MB, 594.9 / 0.0 ms  (+ 657.6 ms in 142 steps since start of marking, biggest step 22.5 ms, walltime since start of marking 1577 ms) (average mu = 0.446, current mu = 0.451[127:0x56098b0]    67339 ms: Mark-sweep (reduce) 1495.2 (1526.1) -> 1494.4 (1526.3) MB, 2339.8 / 0.0 ms  (average mu = 0.221, current mu = 0.003) allocation failure; scavenge might not succeed
<--- JS stacktrace --->
FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
 1: 0xb9c310 node::Abort() [/usr/local/bin/node]
 2: 0xaa27ee  [/usr/local/bin/node]
 3: 0xd73eb0 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 4: 0xd74257 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 5: 0xf515d5  [/usr/local/bin/node]
 6: 0xf63aad v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
 7: 0xf3e19e v8::internal::HeapAllocator::AllocateRawWithLightRetrySlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node]
 8: 0xf3f567 v8::internal::HeapAllocator::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node]
 9: 0xf2076a v8::internal::Factory::NewFillerObject(int, v8::internal::AllocationAlignment, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/usr/local/bin/node]
10: 0x12e599f v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/usr/local/bin/node]
11: 0x17125f9  [/usr/local/bin/node]
Aborted (core dumped)
error Command failed with exit code 134.

根据网上的一些文章,我尝试限制 node 内存。

export NODE_OPTIONS=--max_old_space_size=2048 && yarn build:ssr

结果并没有用,内存还是溢出了。我本地打包试了一下,node 进程大概占用 3.x G。没办法,我将 2048 改成 1500 试了下,服务器还是无法打包,内存还是耗尽了。难道配置没生效?

万分无奈之下,我只能升级配置,4G 升级到 8G,花了五百多😢。

再次打包,结果还是溢出了???

等等,难道配置其实是生效的?毕竟 max_old_space_size 只是限制了老生代内存的大小。于是我把这个数值改成 4096,再次打包,激动人心的等待中……当当,打包好了。

为什么呢?这次发版也没改多少东西啊?然后我在打包输出日志中看到了这个:

[vite:css] end value has mixed support, consider using flex-end instead
43 |  	flex-direction: column;
44 |  	padding-left: 5px;
45 |  	padding-right: 5px;
   |                 ^
46 |  	justify-content: end;
47 |  	border-right: 1px solid var(--vscode-editorHoverWidget-border);
Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
Use of eval is strongly discouraged, as it poses security risks and may cause issues with minification
warnings when minifying css:
▲ [WARNING] Expected identifier but found "." [css-syntax-error]
    <stdin>:3476:1:
      3476 │   .gutterItem {
           ╵   ^
▲ [WARNING] Expected identifier but found "." [css-syntax-error]
    <stdin>:3546:1:
      3546 │   .line-left, .line-right {
           ╵   ^
▲ [WARNING] Expected identifier but found ">" [css-syntax-error]
    <stdin>:3667:1:
      3667 │   > div {
           ╵   ^
▲ [WARNING] Expected identifier but found "." [css-syntax-error]
    <stdin>:6068:1:
      6068 │   .promptEditor .monaco-editor {
           ╵   ^

嗯……这次……加了 monaco-editor。早知道这样用 cdn 不就好了吗,用 vue-monaco-editor 这个库就可以了啊………………

轻量服务器不支持降级啊,我的钱啊~~~~~~~~~~~

8G 内存空闲 7G,心痛啊~~~~~~