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

A couple of questions about Webpack HMR and how to use it in ReactJS application from scratch?

Currently, I have a task that integrating Webpack HRM into Single Spa application. So I have researched some articles about Webpack HRM and React Hot Loader or React Fast Refresh. I also read some articles that using module.hot.accept to receive new…
1
vote
2 answers

Can't access my nuxt 2 dev server on another devices (except of hosting one)

I use portable hotspot for internet access. Devices: Phone (hotspot) - site isn't accessible (err_connection_timed_out) Laptop (development server) - site accessible Another phone - site isn't site accessible(err_connection_timed_out) Another laptop…
IninsayY
  • 23
  • 5
1
vote
0 answers

Npm build stage is taking 1 hour to run and failed once adding "builder": "@angular-builders/custom-webpack:dev-server" to angular.json

I have added custom webpack to my angular project angular.json : { "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "version": 1, "newProjectRoot": "projects", "projects": { "youdeserve-frontend": { "projectType":…
1
vote
2 answers

Hot reloading not working on React project with Webpack 5

When I save my changes, the whole app is re-rendered and not only the changes that I have made. I have tried adding target: "web" to my devServer and also tried the following…
Moty D
  • 43
  • 5
1
vote
1 answer

webpack 5.21.2 Invalid options object. Ignore Plugin has been initialized using an options object that does not match the API schema

Below is my webpack.config.js in a backend server with webpack version 5.21.1 /* eslint-disable */ const path = require('path'); const webpack = require('webpack'); module.exports = { target: 'node', module: { rules: [ { test:…
RH-st
  • 97
  • 2
  • 10
1
vote
2 answers

Webpack problem with Axios in Outlook-AddIn/React

I'm still a little new to the JS environment and desperately need some help. I want to create an Outlook addin with a react-interface and have created a template via the yeoman generator. Finally I added a library called axios to the project via…
1
vote
0 answers

url.format is not a function at ./node_modules/react-dev-utils/webpackHotDevClient.js

I've upgraded my React project to Webpack 5, upgraded react-dev-utils to the latest version as well Webpack Dev Server is giving me this error: main.js:3940 Uncaught TypeError: url.format is not a function at…
Ivan Kohut
  • 51
  • 5
1
vote
0 answers

Cannot GET localhost:9000/main.js frontend using Kubernetes / Ingress-NGINX

I have a SPA and a microservices architecture. I am running the program locally on my machine using skaffold dev and kubernetes with Google Cloud Provider (GCP). I am connecting my frontend to my backend using Ingress-NGINX. When I go to the host…
melv3223
  • 67
  • 5
1
vote
1 answer

Angular proxy config for multiple target url

I have a few endpoints like below. abcd/text/data xyz/text/data Pqr/text/data I am trying to add these in proxy config file as fixing cors error. For single url it is working fine but for all url it is not working. What should i add object key…
CBP
  • 33
  • 6
1
vote
0 answers

how to NOT crash the build on TS/lint error in nrwl/nx projects

When there's a TS/lint error, the build crashes ie can't see the UI Even tho I have the ENV variables that tell webpack to compile on error: ESLINT_NO_DEV_ERRORS=true TSC_COMPILE_ON_ERROR=true Ideas to work around that? Here's all the related…
Shining Love Star
  • 5,734
  • 5
  • 39
  • 49
1
vote
1 answer

How to obtain detailed compilation error?

I migrated a create-react-app to webpack unfortunately there are some mistake at compilation. But the mistake message is not significant to find where the error is coming from. Is there a way to improve the log output of webpack compilation ? My log…
sancelot
  • 1,905
  • 12
  • 31
1
vote
0 answers

Javascript heap out of memory with old solutions not working

When i run my dev script: "dev": "webpack-dev-server --config webpack.dev.js" i get FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory. I tried to add --max_old_space_size flag as suggested in many posts but that…
Levyi
  • 21
  • 4
1
vote
2 answers

Can't get webpack-dev-server running

I am having some trouble getting my react app to run. I have tried multiple things, downgrading webpack version, doing npm i -g webpack-dev-server and even npm i -g webpack-cli and nothing is working. Below is the error message I am getting. Would…
quefro
  • 101
  • 4
  • 12
1
vote
0 answers

webpack-dev-server infinite reload loop in Angular 14 app

I have an issue after migrate my project from Angular 13 to Angular 14. When save any change to the source code, webpack-dev-server goes into infinite compile loop. There are colleagues that have the same problems and collegues that, with the same…
gcannone
  • 11
  • 1
1
vote
0 answers

Can Webpack HMR be used for updating externally loaded files?

My app loads a few different files at runtime that are NOT compiled/known by webpack. Language files (.json), some external css styles (.css). When my app runs on webpack-dev-server, i'd like it to receive updates for these files when they change -…