search

webpack / webpack-dev-server

Serves a webpack app. Updates the browser on changes. Documentation https://webpack.js.org/configuration/dev-server/.
MIT License
7.8k stars 1.43k forks source link

Webpack dev server HRM not update vuejs file after compile error #5064

Closed keitetran closed 6 months ago

keitetran commented 7 months ago

Hi, I readd all issue but can not fix this error. Please help me. I am upgrade webpack dev server with new version

Bug report

Webpack dev server HRM not update vuejs file after compile error

Webpack version 

    "webpack": "^5.90.3",
    "webpack-dev-server": "^5.0.2",

Actual Behavior

  1. Make code working fine, HRM replace html text or js code...
  2. Make it error, ex: call a not exits method => HRM will display error on overlay of client
  3. Make code working (remove not exits method) => HRM remove ovelay, webpack complie OK and new code push to client side
  4. See client not update screen new code
  5. Change html text but not replace (reload page will working fine)

Expected Behavior

I canot fix it

How Do We Reproduce?

More information

webpack dev server config 

allowedHosts: "all",
hot: true,
liveReload: false,
devMiddleware: {
  serverSideRender: true,
  writeToDisk: true
},
client: {
  logging: "info",
  overlay: true,
  progress: true,
  reconnect: true,
},

Client log

[webpack-dev-server] 100% - Compilation completed.
log.js:39 [HMR] Updated modules:
log.js:27 [HMR]  - ./client/views/users.vue?vue&type=script&lang=js
log.js:39 [HMR]  - ./client/views/users.vue?vue&type=script&lang=js
log.js:39 [HMR]  - ./client/views/users.vue
log.js:27 [HMR]  - ./client/views/users.vue?vue&type=template&id=e7c7191e
log.js:39 [HMR]  - ./client/views/users.vue?vue&type=template&id=e7c7191e
log.js:39 [HMR] App is up to date.

Code view not exits method image

exits method image

System:
  OS: Windows 11 10.0.22631
  CPU: (12) x64 AMD Ryzen 5 5600X 6-Core Processor
  Memory: 15.84 GB / 31.92 GB
Binaries:
  Node: 20.11.0 - C:\Program Files\nodejs\node.EXE
  npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
Browsers:
  Edge: Chromium (121.0.2277.128)
  Internet Explorer: 11.0.22621.1
Packages:
  babel-loader: ^9.1.3 => 9.1.3
  css-loader: ^6.10.0 => 6.10.0
  css-minimizer-webpack-plugin: ^6.0.0 => 6.0.0
  eslint-webpack-plugin: ^4.0.1 => 4.0.1
  html-webpack-plugin: ^5.6.0 => 5.6.0
  postcss-loader: ^8.1.0 => 8.1.0
  sass-loader: ^14.1.1 => 14.1.1
  style-loader: ^3.3.4 => 3.3.4
  vue-loader: ^17.4.2 => 17.4.2
  vue-style-loader: ^4.1.3 => 4.1.3
  webpack: ^5.88.1 => 5.90.3
  webpack-dev-server: ^5.0.2 => 5.0.2
  webpack-merge: ^5.10.0 => 5.10.0
  webpack-node-externals: ^3.0.0 => 3.0.0
alexander-akait commented 7 months ago

Looks like you forgot to include chunk in your HTML document, can you provide reproducible test repo?

samrudh3125 commented 7 months ago

@dhruvdutt I want to connect on discord to discuss regarding gsoc kindly send the connection link

alexander-akait commented 6 months ago

Closing due to inactivity. Please test with latest version and feel free to reopen if still regressions. Thanks!