Questions tagged [webpack-dev-server]

a Node.js based server that supports live reloading and is used for development of webpack powered applications.

webpack-dev-server is a little Node.js Express server, which uses the webpack-dev-middleware to serve a webpack bundle. It also has a little runtime which is connected to the server via Socket.IO. The server emits information about the compilation state to the client, which reacts to those events by updating the bundle.

The server is used for development purpose only.

3256 questions
22
votes
7 answers

'webpack-dev-server' is not recognized as an internal or external command,

I cloned this Webpack Starter package through github using gitbash following a tutorial on pluralsight. I am trying to access webpack through Visual Studio Code's integrated terminal but i get the following error. I am new to this so kindly help me…
Raza Zaidi
  • 520
  • 1
  • 3
  • 17
22
votes
5 answers

How to run webpack-bundle-analyzer?

I installed webpack-bundle-analyzer and need to run it. How can I do it? I have several errors. One of the most common is Could't analyze webpack bundle
Roman
  • 19,236
  • 15
  • 93
  • 97
22
votes
3 answers

Webpack console.log output?

Can anyone direct me in the right direction? So i've setup the webpack-dev-server with the truffle suite demo, just to get a basis on the foundation of my app. So my config file includes index.html & app.js, yet it try to display a console.log…
22
votes
6 answers

Is there a way to make webpack not show all the chunks it's compiling?

The default webpack CLI output is way too verbose for my liking. As soon as I import React from one of my files, the output explodes, showing all of the chunks (?) being packed: webpack result is served from / content is served from…
Cam Jackson
  • 11,860
  • 8
  • 45
  • 78
21
votes
9 answers

Webpack dev server not auto-reloading

So I've setup webpack and webpack-dev-server, but webpack-dev-server does not auto-reload. If i modify a file and save it there is no change in the browser until I manually refresh. Here is my webpack config and my script file that runs…
hal
  • 4,845
  • 7
  • 34
  • 57
21
votes
5 answers

Webpack + Babel: Couldn't find preset "es2015" relative to directory

I have a React project using Webpack and Babel. When I created it on an office computer, the Webpack ran fine. When I cloned the project onto my personal computer, it gave the following error: ERROR in ./react_minesweeper.jsx Module build failed:…
Louis Cruz
  • 1,703
  • 2
  • 15
  • 20
21
votes
6 answers

webpack hot module replacement: css without refresh

So far I've been using livereload so that whenever I change JS or templates, the page refreshes, and when I change CSS, it would hotswap the new CSS without a refresh. I'm trying out webpack now and nearly got to the same behaviour, with one…
Bart van den Burg
  • 2,166
  • 4
  • 25
  • 42
20
votes
1 answer

How to solve ChunkLoadError: Loading hot update chunk second_app failed in webpack 5?

while setup a new project for development, the app is not hot reloading. The app consists of multiple apps separated in its different folders.Currently, there are 2 apps html_nodes_prototype and second_app in src/apps folder. Each app consist of…
DecPK
  • 24,537
  • 6
  • 26
  • 42
20
votes
5 answers

Webpack dev server custom parameters from command line

I want to pass custom parameters from command line. Something like this: webpack-dev-server --inline --hot --customparam1=value Exactly what I am trying to achieve is that I am working on a vue-loader application. The application has certain…
rahulserver
  • 10,411
  • 24
  • 90
  • 164
19
votes
2 answers

CleanWebpackPlugin does not clean in Webpack 5

I am using latest version of webpack 5.3.2 with "clean-webpack-plugin": "^3.0.0". And apparently the plugin does not clean dist folder when I build. Here's my webpack info: Binaries: Node: 12.18.1 - ~/.nvm/versions/node/v12.18.1/bin/node …
Melchia
  • 22,578
  • 22
  • 103
  • 117
19
votes
6 answers

Webpack 4 Hot Reload: Invalid Host/Origin header

I'm working with webpack-dev-server to do hot reloading. However in my console it keeps saying Invalid Host/Origin header The setup I have in my webpack config is as follows: 'use strict' const webpack = require('webpack') const { VueLoaderPlugin }…
Maarten Raaijmakers
  • 615
  • 2
  • 8
  • 20
19
votes
2 answers

webpack live hot reload for sass

I am building a workflow for a react starter and would like to have my browser auto reload when I make a change to my scss files. Currently, webpack will hot reload when I make a change in my index.js file (set as my entry point). However when I…
19
votes
3 answers

req.handle.writev is not a function

I'm using React, React-Redux with Webpack for my project in a Docker container and keep running into this error internal/stream_base_commons.js:59 var err = req.handle.writev(req, chunks, allBuffers); ^ TypeError:…
Kendall
  • 5,065
  • 10
  • 45
  • 70
19
votes
5 answers

Webpack out of memory

When I'm working with a webpack-dev server, the problem sometimes occurs FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory more here Config webpack.config.js "webpack": "^4.5.0", "webpack-cli":…
Pavel Perevezencev
  • 2,596
  • 3
  • 28
  • 49
19
votes
2 answers

Angular 6 [WDS] Disconnected Error on Firefox

I use Angular and i get console error only on Firefox "[WDS] Disconnected!". Here is my Angular-Cli version. Angular CLI: 6.0.1 Node: 8.11.1 OS: win32 x64 Angular: 6.0.1 ... cli, common, compiler, compiler-cli, core, forms, http ...…
mehmetdemiray
  • 976
  • 4
  • 13
  • 32