Stack Overflow
Stack Overflow

Questions tagged [webpack-dev-middleware]

handles latest webpack output in memory for Express (node platform) web server (so it is an Express middleware)

Supports Hot Module Reload (HMR).

Used by webpack-dev-server internally (webpack-dev-server is a complete preconfigured Express server distribution)

https://github.com/webpack/webpack-dev-middleware

103 questions
115
votes
2 answers

Webpack vs webpack-dev-server vs webpack-dev-middleware vs webpack-hot-middleware vs etc

I'm starting working with webpack with a node/express environment developing a ReactJS server side rendered application with react-router. I'm getting very confused about the role of each webpack package for dev and prod (runtime) environments. Here…
Mendes
  • 17,489
  • 35
  • 150
  • 263
11
votes
6 answers

webpack-dev-server set cookie via proxy

We have setup our development environment with webpack-dev-server. We use its proxy config to communicate with the backend. We have a common login page in the server which we use in all our applications. We it is called, it sets a session cookie…
Ishan Hettiarachchi
  • 1,426
  • 2
  • 19
  • 31
10
votes
2 answers

webpack-dev-middleware pass through for all routes

I'm using webpack-dev-middleware along with a react app using react-router on the client. All is well if i enter the application at the root /, but webpack-dev-middleware will not serve anything with a path, like…
MattoTodd
  • 14,467
  • 16
  • 59
  • 76
10
votes
1 answer

Simplest way to hot reload a CSS file in Webpack using Webpack Dev Middleware

I have a project written in TypeScript that I can take advantage of Webpack Hot Reload, using both webpack-hot-middleware and webpack-dev-middleware libraries in my Node.js server. Also, I already have all the build steps configured for my Stylus…
Buzinas
  • 11,597
  • 2
  • 36
  • 58
8
votes
2 answers

Webpack, Dev-Middleware, and Static Files

I've got a Webpack/React/Redux project served with Express and I'm having some trouble understanding how they fit together. My Express app runs Webpack and serves my root index.html file like so: const app = express(); const server =…
D Vorona
  • 136
  • 1
  • 8
7
votes
1 answer

ValidationError: Invalid options object. Dev Middleware has been initialized using an options object that does not match the API schema

Currently learning React JS, I am still newbie regarding these technologies. After updating the webpack from 4.30.0 to 5.10.0 then I run npm start, some errors appeared as below. I have tried to delete node_modules and reinstall, then npm start, it…
Muhammad Rafi Bahrur Rizki
  • 451
  • 8
  • 17
7
votes
1 answer

How do I refresh browser from server-side with node.js?

I want to reload page when my html files are changed (while development) because of HMR bug in html-webpack-plugin and webpack-dev-middleware (webpack-hot-middleware) interop. Here are two repositories where I got this problem, there are issues in…
zerdox
  • 830
  • 8
  • 22
7
votes
0 answers

How to reference in-memory bundle from webpack-dev-middleware / webpack-hot-middleware

I'm implementing Webpack into a legacy Express frontend application. I've followed the instructions to implement both webpack-dev-middleware and webpack-hot-middleware, but I can't figure out how to actually reference the in-memory bundle that…
tomtom
  • 1,130
  • 2
  • 11
  • 35
7
votes
2 answers

How can set up my Vue.js site to clear the browser's Javascript console on every hot reload event?

I have a Vue.js site with Webpack Dev Middleware (served via an ASP.NET Core site by HTTP.sys web server, though I'm guessing that doesn't matter). Does anyone know how I can set up my site to clear the browser's Javascript console on every hot…
Patrick Szalapski
  • 8,738
  • 11
  • 67
  • 129
6
votes
3 answers

Stylus syntax - where do imports come from?

I've got a file called "quasar.styl": @import './quasar.variables' @import '~quasar-styl' When it gets processed by webpack, using styl-loader, I get this error: failed to locate @import file ~quasar-styl.styl I have this feeling there's something…
Jim B.
  • 4,512
  • 3
  • 25
  • 53
6
votes
1 answer

webpackDevMiddleware not auto reloading

So I am using the webpack dev middleware as follows: const compiledWebpack = webpack(config), app = express(), devMiddleware = webpackDevMiddleware(compiledWebpack, { historyApiFallback: true, …
Danny Fenstermaker
  • 914
  • 10
  • 12
6
votes
1 answer

Is it possible to have the progress displayed when using webpack-dev-middleware like the --progress option from webpack-dev-server?

I have an express server that uses webpack-dev-middleware. If you run webpack-dev-server from the cli there's a "progress" option that causes the progress to be displayed on the console. This is a nice to have feature that I would like when using…
Vlad
  • 385
  • 2
  • 13
5
votes
1 answer

How to load images in phaser app when using webpack-dev-middleware?

I've got Webpack/Phaser/Express project. When i load the app, images can't be load with following errors in Chrome console: GET http://localhost:8080/assets/ui/blue_button03.png 500 (Internal Server Error) GET…
YurasMarsh
  • 51
  • 3
5
votes
0 answers

bundle.js served via webpack not working for webpack-dev-middleware + HtmlWebpackPlugin

So, I am trying to use webpack-dev-middleware & webpack-hot-middleware with HtmlWebpackPlugin and for that I have followed the following links https://github.com/jantimon/html-webpack-plugin/issues/145 but I really can't understand what is suggested…
Prateek
  • 3,923
  • 6
  • 41
  • 79
5
votes
0 answers

"Invalid or unexpected token" on Node Express SSR of image imports

I am using url-loader as part of my webpack build process and its correctly moving the image files (or creating Base64 DataURL strings) for any image files that I import in my JS files, such as: import appleTouchIcon from…
Fenda
  • 1,385
  • 3
  • 14
  • 24
1
2 3 4 5 6 7