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
13
votes
5 answers

How to get Webpack Dev Server to display images stored locally?

I migrated a project I have been working on to Webpack 2 and this has been kind of a headache. But I have gotten my project to preview using Webpack dev server, except it won't show my image. All I get is this error in the browser console GET…
feners
  • 645
  • 5
  • 19
  • 48
13
votes
6 answers

Is there a way to configure webpack-dev-server to open a specified browser window ? For example Chrome Canary on mac

I have googled about it, could not find anything related to the question. The reason I want this is for workflow issues. I have setup a developer account on chrome canary and would like to keep all things related to development to that browser. In…
frank3stein
  • 706
  • 2
  • 7
  • 16
13
votes
4 answers

ERROR in multi (webpack)-dev-server/client

I'm new to webpack / reactjs, just follow the tutorial here: https://www.tutorialspoint.com/reactjs/reactjs_environment_setup.htm Then after I 'npm start', I got error: ERROR in multi (webpack)-dev-server/client?http://localhost:8080…
Weijing Lin
  • 575
  • 2
  • 5
  • 16
13
votes
1 answer

Webpack-dev-server serving in different folder than webpack output

This is in my webpack.config.js: var path = require('path'); module.exports = { entry: './src/index.jsx', output: { path: path.resolve(__dirname, 'build'), filename: 'bundle.js' }, devServer: { inline: true, port: 8080 }, …
Christian Gill
  • 514
  • 5
  • 21
13
votes
7 answers

react-route,react-hot-loader.webpack (You cannot change ; it will be ignored)

it's my first project that use react,react-router,react-hot-loader,webpack-dev-server and webpack. when I change the code in react component, the hot-loader become effective, but at the same time, the console tell me a warning: You cannot change…
13
votes
0 answers

Webpack recompiles unchanged files, slowing build times

Relevant webpack/webpack issue. Using webpack in real projects slows down, in my experience, after you pile on a certain number of components and/or dependencies. I have a test repository that seeks to demonstrate this with the following…
Theodor Vararu
  • 401
  • 2
  • 9
13
votes
1 answer

what is the most reasonable way apply webpack to a full-stack node app?

i've been studying up on webpack for a couple of weeks now, and i've seen many examples of front end setups, and probably just this one setup for a backend. i'm trying to setup a react app with a node back-end (e.g. express, koa, hapi, etc) where i…
tony_k
  • 1,983
  • 2
  • 20
  • 27
12
votes
2 answers

Error: Compiling RuleSet failed: Query arguments on 'loader' has been removed in favor of the 'options' property

PS C:\Projects\webpack_react_starter> npm run start webpack_react_starter@1.0.0 start webpack serve --mode development --env development --hot --port…
Amit Dey
  • 131
  • 1
  • 1
  • 3
12
votes
2 answers

content not from webpack is served from /app/public docker

I hope I've spelled correctly. I developed a frontend application with reactjs. I distribute the application I developed with docker-compose. But while distributing, I encounter an error like below. Can you help to solve…
Fatih mzm
  • 395
  • 1
  • 7
  • 21
12
votes
3 answers

HMR not working with Laravel Mix in Docker

I am having some problems setting up Hot Module Reloading in Laravel Mix inside a Docker container. I have the following Dockerfile: FROM php:7.4.0-fpm RUN curl -sL https://deb.nodesource.com/setup_13.x | bash RUN apt-get update && \ apt-get…
12
votes
1 answer

Ruby on Rails 6 + Docker = Webpacker::Manifest::MissingEntryError?

Trying to run my Rails app as a Docker container but got the following error when opening a page: Webpacker can't find application in /app/public/packs/manifest.json. Possible causes: 1. You want to set webpacker.yml value of compile to true for…
12
votes
3 answers

Hot reload not working with webpack-dev-server and docker

Using Ubuntu Linux with docker installed. No VM. I have build a docker image with a vuejs application. To enable hot reload I start the docker container with: docker run -it -p 8081:8080 -e "HOST=0.0.0.0" -v ${PWD}:/app/ -v /app/node_modules --name…
u123
  • 15,603
  • 58
  • 186
  • 303
12
votes
3 answers

Django/Webpack - How to serve generated webpack bundles with webpack dev server

Django's 'static' tag generates urls using STATIC_URL, which results in something like '/static/myapp/js/bundle.js' Mean while, webpack-dev-server is serving bundles from the url 'localhost:3000' My question is how do I get Django 'static' template…
myke
  • 286
  • 3
  • 10
12
votes
1 answer

Vue devServer proxy is not helping, I still get CORS error

I'm using @vue/cli 3.x and in my vue.config.js I have this: devServer: { proxy: { "/api": { ws: true, changeOrigin: true, target: "http://localhost:8080" } } } But I keep getting CORS error: Access to…
Tomer
  • 17,787
  • 15
  • 78
  • 137
12
votes
4 answers

Webpack: process.env undefined using DefinePlugin and DotEnv

I would like to get my variable from my .env file but I always get undefined This is my js code : require('dotenv').config(); class Header extends React.Component{ constructor(props){...} render(){ console.log("NODE ENV",…
anais1477
  • 466
  • 1
  • 17
  • 36