-
-
Notifications
You must be signed in to change notification settings - Fork 2.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Hot reload with setInterval #2606
Comments
Parcel would have to remove only intervals/timeouts that were started by the module to be replaced - how should this be tracked? I think you should take care of this yourself: if (module.hot) {
module.hot.dispose(function() {
clearInterval(...);
})
} |
I use Webpack 4 and do not get such behavior on reloading. I`m also a junior developer and may not understand this issue. Do i have to clear every interval and timeout in my app with this code? if (module.hot) {
module.hot.dispose(function() {
clearInterval(...);
})
} |
Could you share your webpack config (or the relevant parts)? |
Sure: const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const WebpackBar = require('webpackbar');
const isDevMode = process.env.NODE_ENV !== 'production'
module.exports = {
entry: [
'./src/index.js'
],
output: {
path: path.resolve(__dirname, 'build'),
publicPath: '/',
filename: 'bundle.js'
},
module: {
rules: [
{
test: /\.css$/,
include: [
path.resolve(__dirname, 'src')
],
use: [
isDevMode ? 'style-loader' : MiniCssExtractPlugin.loader,
'css-loader'
]
},
{
test: /\.(js|jsx)$/,
include: [
path.resolve(__dirname, 'src')
],
use: [
'babel-loader',
'eslint-loader'
]
},
]
},
resolve: {
extensions: ['.css', '.js', '.jsx']
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css'
}),
new WebpackBar()
],
devtool: 'source-map',
devServer: {
noInfo: true,
stats: 'minimal',
port: 3000,
contentBase: path.join(__dirname, 'build'),
historyApiFallback: true
}
}; |
You're not actually using HMR in your webpack config (this guide show how to enable it in the config: https://webpack.js.org/guides/hot-module-replacement/). I couldn't find it in the webpack docs, but I think webpack reloads the whole page while Parcel does hot reloading (in this case re-execute the Javascript). If this is the case, #289 (comment) describes how to setup your project to reload the page completetly without HMR. |
🐛 bug report
setInterval(console.log, 1000, 'hello')
setInterval(console.log, 1000, 'how are you')
🎛 Configuration (.babelrc, package.json, cli command)
package.json
🤔 Expected Behavior
Previous interval should be cleared.
😯 Current Behavior
Previous interval is not cleared.
💁 Possible Solution
🔦 Context
🌍 Your Environment
The text was updated successfully, but these errors were encountered: