używać HTML-WebPack-plugin sznurkiem-replace-ładowarki w WebPacka

Question

próbuję zastąpić zmienną w index.html, który wygląda tak:

<meta name='author' content=$variable>

w pliku konfiguracyjnym używać:

{ 
    test: /index\.html$/, 
    loader: 'string-replace', 
    query: { 
     search: '$variable', 
     replace: 'stuff to inject', 
    }, 
    } 

loaders w tablicy, a następnie w plugins:

new HtmlWebpackPlugin({ 
    template: conf.path.src('src/index.html'), 
    inject: true, 
}) 

Wyniki

Ale to ustawienie w:

ERROR in ./~/html-webpack-plugin/lib/loader.js!./src/index.html Module parse failed (...) Unexpected token (1:0) You may need an appropriate loader to handle this file type.

Czy macie jakieś pomysły co to może być spowodowane i jak można debugować to?

Answer 1

Jest to spowodowane tym, że string-replace-plugin oczekuje modułu eksportującego ciąg znaków. Powinieneś przekonwertować plik HTML na moduł CommonJS.

Na przykład, jest to sposób, za pomocą raw-loader:

najpierw dodać cytaty do atrybutu content w html

<meta name='author' content='$variable'>` 

i

{ 
    test: /index\.html$/, 
    loader: 'string-replace?search=$variable&replace=stuff to inject!raw' 
    } 

Answer 2

odpowiedź Konstantego działa dobrze i jest dobrze, jeśli chcesz zastąpić jedną wartość. Chciałem zastąpić tak wielu wartości dodanej następujące do mojego loaders tablicy

{ 
    test: /\.html$/, 
    loader: 'raw' 
    }, 
    { 
    test: /\.html$/, 
    loader: 'string-replace', 
    query: { 
     multiple: [ 
     {search: '$variable1', replace: 'replacement 1'}, 
     {search: '$variable2', replace: 'replacement 2'} 
     ] 
    } 
    } 

Kluczową zmianą jest najpierw uruchomić plik HTML, dzięki ładowarce raw, a następnie można wykorzystać wszystkie normalne config dla string-replace-loader.