Webpack hot module replacement does not remove prior dom element -


i not sure if following bug or if have things misconfigured. using webpack-dev-server , hot module replacement, if javascript code contains .appendchild, hmr re-adds dom element, not replace it. first code works correctly:

index.html:

     <div id="app">         <p id="para"></p>      </div> 

index.js:

     var para = document.getelementbyid("para");      para.innerhtml  = "hi there";       if(module.hot){           module.hot.accept();      } 

webpack-config.js:

    var path = require("path");     var webpack = require("webpack");      // note configuring hot module replacement when combined devserver.js     // each js file module add module.hot.accept()     //also need change script in package.json using node command      var entries = [          './src/index.js',         'webpack/hot/dev-server',         'webpack-dev-server/client?http://localhost:8080'     ];           module.exports={          entry:entries ,          output:{              path: path.join(__dirname,"/dist"),              publicpath:"/dist/",              filename:"bundle.js"          }  ,           plugins:[                new webpack.hotmodulereplacementplugin()             ]         };     

devserver.js:

      var webpackdevserver = require('webpack-dev-server');       var webpack = require('webpack');       var config = require('./webpack.config.js');       var path = require('path');       var compiler = webpack(config);      var server = new webpackdevserver(compiler, {             hot: true,             filename: config.output.filename,             publicpath: config.output.publicpath,             stats: {                colors: true             }       });       server.listen(8080, 'localhost', function() {}); 

note again, works, if remove paragraph tag index.html div exists , change index.js to:

     var app = document.getelementbyid("app");      var para = document.createelement("p");      para.innerhtml = "hi there";      app.appendchild(para);       if(module.hot){          module.hot.accept();      }   

then, each change innerhtml text causes hmr work no errors, re-adds new paragraph dom, leaving first paragraph (with old text), still visible , part of page.

any ideas? in advance


Comments

Popular posts from this blog

python - Operations inside variables -

Generic Map Parameter java -

arrays - What causes a java.lang.ArrayIndexOutOfBoundsException and how do I prevent it? -