2015-05-24 18 views
8

Używałem WebPacka, a ostatnio zaktualizowałem kilka pakietów (babel, babel-loader, ..) i widzę błąd w wyjściowym pakiecie sieci Web. ale nie wiem, jak dalej debugować. Aplikacja wydaje się działać dobrze. Próbowałem z różnymi opcjami debugowania, ale nie otrzymałem szczegółowego wyniku błędu.Komunikat o błędach w webpackach

./node_modules/.bin/webpack --config webpack.config.js --progress --profile --colors --display-error-details --display-reasons --debug 
NODE_ENV == production : false 
6809ms build modules  
14ms seal 
55ms optimize 
30ms hashing 
59ms create chunk assets 
27ms additional chunk assets 
1551ms optimize chunk assets 
33ms optimize assets 
83ms emit 
Hash: 5be1a8485c4110c2f837 
Version: webpack 1.9.8 
Time: 8674ms 
     Asset  Size Chunks    Chunk Names 
mww7few.ttf 78.4 kB   [emitted] 
elilql0.png 7.47 kB   [emitted] 
    client.js 3.98 MB  0 [emitted] main 
index.html 130 bytes   [emitted] 
    [0] multi main 52 bytes {0} [built] 
     factory:0ms building:3ms = 3ms 
    + 387 hidden modules 

ERROR in undefined 

Nie jestem pewien, co to jest ERROR in undefined. Podejrzewam, że problem z ładowaczem, ponieważ zaktualizowałem babel-loader, ale nie wiem, jak dowiedzieć się więcej.

Odpowiedz

1

@bsr

Niedawno miałem ten sam problem. Okazuje się, że pochodzi z HtmlWebpackPlugin. Zapomniałam przekazać tytuł

new HtmlWebpackPlugin({ 
    .... 
    title: 'Title' 
}), 

I w moim szablonu miałem ten <title>{%=o.htmlWebpackPlugin.options.title

więc jeśli używasz HtmlWebpackPlugin, upewnij się przejść tam wszystkie parametry.

+0

dziękuję za podpowiedź. Nie jest to jednak dla mnie HtmlWebpackPlugin. ale to dało mi wskazówkę. Sprawdzę ponownie pod kątem konfiguracji moich wtyczek.+1 – bsr

+0

spróbuj zrobić pustą funkcję, 'function hello() {}' następnie użyj tego jako punktu wejścia, sprawdź, czy coś jest nie tak z konfiguracją twojego pakietu sieciowego. Jeśli błąd zniknie, to coś o kodzie, w przeciwnym razie możesz usunąć każdą wtyczkę. – chriz

+0

dzięki. Twoja intuicja była właściwa. https://github.com/ampedandwired/html-webpack-plugin/issues/50. Ponadto twoja metoda debugowania pomaga mi zidentyfikować przyczynę. dzięki za tonę. – bsr

2

Jest to błąd w wersji WebPack-html-Plugin 1.4 i została ustalona na 1,5

Przyczyną błędu jest o.htmlWebpackPlugin.assets jest przestarzała.
Należy użyć o.htmlWebpackPlugin.files zamiast aby móc używać plików css i oczywiste:

<!DOCTYPE html> 
<html{% if(o.htmlWebpackPlugin.files.manifest) { %} manifest="{%= o.htmlWebpackPlugin.files.manifest %}"{% } %}> 
    <head> 
    <meta charset="UTF-8"> 
    <title>{%=o.htmlWebpackPlugin.options.title || 'Webpack App'%}</title> 
    {% if (o.htmlWebpackPlugin.files.favicon) { %} 
    <link rel="shortcut icon" href="{%=o.htmlWebpackPlugin.files.favicon%}"> 
    {% } %} 
    {% for (var css in o.htmlWebpackPlugin.files.css) { %} 
    <link href="{%=o.htmlWebpackPlugin.files.css[css] %}" rel="stylesheet"> 
    {% } %} 
    </head> 
    <body> 
    {% for (var chunk in o.htmlWebpackPlugin.files.chunks) { %} 
    <script src="{%=o.htmlWebpackPlugin.files.chunks[chunk].entry %}"></script> 
    {% } %} 
    </body> 
</html> 

Jednak jest jeszcze prostszy sposób.
Wtyczka webpack-html 1.3+ ma funkcję, która wstrzykuje wszystkie zasoby (pliki css, favicon, javascript i manifest) do szablonu. Więc konfiguracja może wyglądać następująco:

new HtmlWebpackPlugin({ 
    inject: true, 
    template: 'template.html', 
    title: 'Custom template', 
}) 

i szablonu:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>{%=o.htmlWebpackPlugin.options.title || 'Webpack App'%}</title> 
    </head> 
    <body> 
    </body> 
</html> 
1

W przypadku ktoś dostaje na to pytanie i nie jest to problem z htmlWebpackPlugin, IMO rzeczywisty problem jest w Webpack sama w sobie, która nie zapewnia prawidłowego błędu.

Najwyraźniej PR próbuje rozwiązać to

https://github.com/webpack/webpack/pull/1146

Mamy używamy wtyczek, które zostały thowing błędy, które były struny. Jednak błędy naprawiono:

Błąd nieokreślony, który był mało pomocny. Teraz otrzymujemy raport o błędzie , którego potrzebujemy.

Statystyki dotyczące zgłaszania błędów wychwytują błędy ciągów. Niektóre wtyczki pojawiają się , aby nie przestrzegać zasad zgłaszania błędów. To jednak sprawia, że ​​debugowanie jest koszmarem dla użytkowników. Dlatego łańcuch powinien być dozwolony.

Powiązane problemy