Giters

andrewagain / webpack-hmr-3-ways

Three ways to set up your webpack hot module replacement: webpack-dev-server CLI, webpack-dev-server API, and express with webpack-hot-middleware.

Home Page:https://www.javascriptstuff.com/3-ways-webpack-hmr

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

document.writeln vs console.log

bencooling opened this issue · comments

commented

Thanks @ahfarmer for your posts and repos.

You mention in the source code
// console.log statements are reprinted on every reload.

Can you explain if I replace console.log with document.writeln it doesn't reload?

commented

Hmmm, I don't think document.writeln will work with HMR.

document.writeln doesn't work after the document is finished writing. HMR works by updating JavaScript without a reload, which means the document will always be finished loading.

I think this StackOverflow post might help.

You probably want something like browserSync. It will reload the entire webpage whenever you make changes.

An even better option would be to abandon document.writeln in favor of DOM manipulations like createElement and appendChild.

commented

👍🏼Legend thanks heaps. I didn't particularly need document.writeln but it tripped me up as I thought I didn't have HMR working until I finally decided to use a console.log after reading over your source code. Thanks again.