2017-10-01 18 views
0

Ich benutze reagieren mit Webpack.Webpack Dynamischer Import Ausdruck funktioniert nicht

Ich habe einen Ordner mit Hunderten von SVGs drin.
Dabei verwende ich dynamische Import-Syntax von webpacks wie import('../images_svg/' + svgData.path + '.svg') leider funktioniert das nicht. Auch ich benutze den Svg-Inline-Loader.

Deshalb habe ich die folgende Ausnahme erhalten:

<--- Last few GCs ---> 

    95733 ms: Mark-sweep 1301.0 (1434.6) -> 1303.2 (1434.6) MB, 61.8/0.0 ms [allocation failure] [scavenge might not succeed]. 
    95794 ms: Mark-sweep 1303.2 (1434.6) -> 1305.4 (1434.6) MB, 60.9/0.0 ms [allocation failure] [scavenge might not succeed]. 
    95856 ms: Mark-sweep 1305.4 (1434.6) -> 1312.2 (1418.6) MB, 62.3/0.0 ms [last resort gc]. 
    95922 ms: Mark-sweep 1312.2 (1418.6) -> 1319.1 (1418.6) MB, 65.9/0.0 ms [last resort gc]. 


<--- JS stacktrace ---> 

==== JS stack trace ========================================= 

Security context: 000001788583FA99 <JS Object> 
    1: stringify [native json.js:178] [pc=000002CFEA0A3CF7] (this=0000017885846091 <a JSON with map 0000010551613B91>,E=0000023A39E19981 <Very long string[11977826]>,F=0000017885804241 <undefined>,S=0000017885804241 <undefined>) 
    2: arguments adaptor frame: 1->3 
    3: /* anonymous */ [C:\Users\phili\Documents\Kunden\step1\app\node_modules\webpack\lib\EvalDevToolModuleTemplatePlugin.js:~17... 

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 

Wie kann ich alle SVGs dynamisch importieren webpack verwenden, ohne einen Haufen Fehler aus dem Speicher zu bekommen?

+0

eine Bibliothek wie axios und den von SVGs im öffentlichen Ordner setzen ist eine Lösung, aber ich denke, es ist wirklich nicht der empfohlene Weg – speedDeveloper

Antwort

0

Nachdem ich das Team hinter GitHub kontaktiert habe, habe ich die Lösung für das Problem gefunden. Der Schlüssel ist

node --max_old_space_size=8000 scripts/start.js

zu sehen, zu bedienen, dass es funktionierte, brauchte ich etwa 10 Minuten zu warten und den Prozess nicht unterbrechen. Um dies schneller zu machen, können wir den Cache-Loader von webpack verwenden. Dies reduziert die Ladezeit auf eine Minute.

Siehe diesen Thread für das Problem https://github.com/webpack/webpack/issues/5747