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
1
vote
1 answer

Webpack proxy inside docker throws EINVAL on connection to external local api

I have quasar vue fronted which use web-pack dev server running inside docker and I use proxy.js (in main directory) to avoid CORS errors for API requests. However when I send request to API in my browser I see folowing error in terminal (where I…
Kamil Kiełczewski
  • 85,173
  • 29
  • 368
  • 345
1
vote
1 answer

What are the advantages of running bin/webpack-dev-server alongside rails server

I have a Rails application which uses Reactjs for client side and I am using webpacker to compile JS. What are the advantages of running bin/webpack-dev-server alongside rails server? I know a few like Hot Module Reload and live reloading upon…
Rishabh
  • 223
  • 2
  • 6
1
vote
2 answers

What should be the public directory for msw initialization when using webpack-dev-server?

I had read the Where is my "public" directory? documentation. A public directory is usually a root directory of your server (i.e. ./build, ./public, or ./dist). This directory is often committed to Git, and so should be the Mock Service Worker. I…
Lin Du
  • 88,126
  • 95
  • 281
  • 483
1
vote
0 answers

Splitchunk plugin with dynamic import

I am using dynamic import at route level with react router and also for some common modal components. There is a utils folder with all atoms, like button, calendar, form etc. When using default config of splitchunk plugin, these utils and other…
Sujoy Saha
  • 220
  • 1
  • 13
1
vote
0 answers

images in src in angular 12 update are not loadded in webpack-dev-server

when we update our code for angular 12, we have an issue with webpack-dev-server (prod works ok) with the images src on HTML. e.g: please see example for the image src here
spinker
  • 298
  • 4
  • 20
1
vote
1 answer

Webpack 5.47.1 : Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema

I am using React Application. Below is my Webpack Configuration file for 5.47.1. const path = require('path'); const webpack = require('webpack'); process.noDeprecation = true; module.exports = (options) => ({ entry: options.entry, output:…
Matarishvan
  • 2,382
  • 3
  • 38
  • 68
1
vote
0 answers

how do i fix the hot-reload on webpack

so, i have the webpack working with 'npx webpack server' and it compiles any changes...but i still need to refresh the browser when i make a change (for example, in options.mjs, i change lala() to show 'hello' and save, but nothing shows up in the…
abda
  • 11
  • 2
1
vote
1 answer

HMR/Live Reload with Webpack 5 Dev Server

I am trying to get the HMR/Live reload feature of webpack to work but while 'watching' files seems to work, the refresh of the browser won't happen. const path = require('path'); const MiniCssExtractPlugin =…
Zakalwe
  • 1,444
  • 3
  • 14
  • 25
1
vote
0 answers

404 Cannot POST React Form after adding webpack

As title implies, I am getting a "404 cannot POST /signup" when I try to submit my form. Also, the data from the form is not begin sent to the onSubmit handler (or the onSubmit handler is not being called, I'm not sure which, since my alert is not…
Rish
  • 11
  • 1
1
vote
1 answer

Webpack / Webpacker not serving styles with RSpec tests. webpack-dev-server not configured?

I'm new to webpack and clearly missing something here. This seemed to be working until we upgraded our app to rails 6.1 and webpacker 5.4. yarn --version webpack outputs 1.22.10 Everything appears to get served correctly in the development…
1
vote
0 answers

Copying a python script to build folder during the webpack bundling of a nextjs react app

I have an api route /auth/calculator and the handler spawns a child_process and then invokes a python script. The problem is my webpack bundler with nextjs doesn't copy the python file over to /build/server/pages/api/calculator and so when node…
seanEd
  • 1,001
  • 1
  • 16
  • 29
1
vote
0 answers

Webpack HMR does not work with `localhost`, only with `--host=[::1]`

It all started when I tried to use the hot reload for storybook, which worked fine on my Macbook, but for whatever reason didn't work on my Windows machine. I always got a request to __webpack_hmr which would be in the pending-state für about 10…
Staeff
  • 4,994
  • 6
  • 34
  • 58
1
vote
1 answer

Webpack doesn't auto reload site on external devices connected to same network

I am building a webpack-5 boilerplate. My computer and mobile are connected to the same wi-fi network. Auto-reload and hot reload works fine on my computer. I can access websites generated by Webpack on mobile, but it does not auto-reload on a…
1
vote
1 answer

devServer proxy in vue.config.js incorrectly mapping urls

I'm working on a vue/cli 3 project. My vue.config.js is module.exports = { publicPath: process.env.NODE_ENV == 'production' ? '/admin/' : '/', devServer: { proxy: { '/serveradmin': { target:…
Mark Lilback
  • 1,154
  • 9
  • 21
1
vote
1 answer

Unable to access images from public folder with webpack configuration

This issue seems related to webpack config, as when we serve webpack then bundle/virtual copy is created for development environment, and because of images are not present its showing broken icon. I am unable to access images from public folder in…