Impossibile avviare la sostituzione del modulo hot di webpack

Ho configurato correttamente WebPack: sta compilando correttamente i miei file babel e SCSS e ho ottenuto il corretto funzionamento della funzionalità di controllo. Ma mi piacerebbe anche lavorare con la sostituzione del modulo caldo - e ho difficoltà a farlo funzionare. Quando carico il server di sviluppo nel mio browser mostra Cannot resolve module 'webpack/hot/dev-server'. Il mio config si presenta così:Impossibile avviare la sostituzione del modulo hot di webpack

import webpack from 'webpack'; 
import wpServer from 'webpack-dev-server'; 

var compiler = webpack({ 
    entry: [ 
     './src/core.js', 
     'webpack/hot/dev-server' 
    ], 
    output: { 
     path: outPath, 
     filename: '[name].js' 
    }, 
    resolveLoader: { root: path.join(MODULE_PATH, "node_modules") }, 
    module: { 
     loaders: [ 
      { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' }, 
      { test: /\.scss$/, loader: "style!css!sass" } 
     ] 
    }, 
    plugins: [new webpack.HotModuleReplacementPlugin()], 
    watch: true 
}); 

var server = new wpServer(compiler, { 
    contentBase: outPath, 
    hot: true, 
    quiet: false, 
    noInfo: false, 
    lazy: true, 
    filename: "main.js", 
    watchDelay: 300, 
    headers: { "X-Custom-Header": "yes" }, 
    stats: { colors: true }, 
}); 
server.listen(8080, "localhost", function() {});

e la mia index.html contiene:

<script src="http://localhost:8080/webpack-dev-server.js"></script> 
<script src='main.js'></script>

Qualcuno ha qualche idea?

fonte

2015-03-26 Alastair

Non è possibile combinare la modalità lazy di webpack-dev-server con HMR. La modalità lenta ricompila solo quando su richiesta HTTP. HMR fa affidamento su osservatori che ricompilano il cambiamento. Usa 'pigro: falso' invece o semplicemente omettalo. –

Ho pubblicato una piccola spiegazione su come funziona HMR e cosa è necessario per farlo funzionare: http://stackoverflow.com/questions/37016683/what-aspect-of-hot-module-replacement-is-this-article- per/37022884 # 37022884 –

Se è stato installato webpack-dev-server a livello globale, ovvero npm install webpack-dev-server -g, provare ad installarlo localmente (è sufficiente rimuovere l'opzione -g).

Ho risolto questo problema facendo così.

fonte

2015-05-27 13:05:47 syfee

Sembra che l'opzione '--hot' stia cercando alcuni file localmente. Forse c'è un modo per dire che sono installati a livello globale. Perché installare dev-server a livello locale e globale sembra imbarazzante. –

@yvesamsellem Suppongo che questo problema abbia a che fare con il fatto che 'webpack-dev-server' determina la directory di base del progetto. Ho controllato i documenti e sembra che l'utilità esponga l'opzione '--content-base' per sovrascrivere il valore predefinito. In ogni caso, l'installazione come 'devDependency' locale dovrebbe essere l'approccio preferito per mantenere la coerenza tra le piattaforme. –

Mi sono imbattuto in un problema simile. L'ho risolto installando localmente il webpack. Per installare webpack come dipendenza dev locale: npm i -D webpack

fonte

2016-03-01 03:24:32 thiagodebastos

IMPORTANTE

Se si utilizza [email protected] assicurarsi di installare

[email protected]

Just running npm install webpack-dev-server non funziona con il pacchetto web 2.

Questo probabilmente sarà vero solo mentre la versione 2 è ancora in beta.

Ho anche faticato a farlo funzionare poiché la documentazione su questo argomento è molto frammentata.

Abbiamo trovato questo semplice esempio di lavoro:

https://github.com/ahfarmer/webpack-hmr-starter-dev-server-api

codice è piuttosto auto esplicativo.

fonte

2016-04-15 15:20:14

Impossibile avviare la sostituzione del modulo hot di webpack

risposta

Problemi correlati