Questions tagged [webpack-dev-server]
a Node.js based server that supports live reloading and is used for development of webpack powered applications.
3,113
questions
1
vote
0
answers
19
views
Browser tab freezes when running webpack-dev-server in development mode using remote Module Federation module
Dependency versions:
webpack: 5.73.0
webpack-dev-server: 4.9.2
This occurs when running a host application via webpack-dev-server that consumes micro-apps via ModuleFederationPlugin.
Example host ...
0
votes
1
answer
11
views
Webpack hot module replacement, how to configure watched directories
I'm on webpack 5.x and webpack-dev-server 4.x and use hot module replacement.
In certain cases, I want to watch an imported module from node_modules and use the hot module replacement on this as well.
...
1
vote
0
answers
16
views
Webpack-dev-middleware and webpack-hot-middleware configuration
I have some conceptual troubles with webpack-dev-middleware and webpack-hot-middleware
I have SSR app (react + express), webpack (with clientside and serverside configs). Webpack configs:
client....
-2
votes
0
answers
26
views
Does webpack devserver have some option for using h2c protocol (http2 without TLS)?
I am building and deploying a node app using webpack to cloud run. The min.js file is 45 MB and greater than 32 MB. There are 2 workarounds mentioned. One is to use 'Transfer-encoding: chunked' header,...
0
votes
1
answer
13
views
webpack 5 / webpack-dev-server: how to serve other file then index.html
When i was using webpack 4 (4.44.1) with webpack-dev-server (3.11.0) i had a setting
devServer: {
index: 'other_filename.html'
}
and thanks to that setting dev server was serving that file at / ...
0
votes
0
answers
29
views
Next.js fastReresh struck in infinite loop in function "onFastRefresh(hasUpdates)"
I'm have a problem when I'm tried to save code editor. Fast Refresh function is struck in infinite loop
have any way to fix this problem ?
it append like this
[Fast Refresh] done in 673336ms hot-dev-...
0
votes
1
answer
27
views
ReactJS: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
I'm facing the below issue on a ReactJS project (A small project not a complex big one) which is manually configured with Webpack and Babel. After some time ( 2 - 3 hrs ) this error popped up and if I ...
0
votes
0
answers
20
views
How to deploy a React project using Webpack on Server side
I have come across many articles pertaining to creating a client side project using webpack and react. But how to deploy the same client side project on to a server to be hosted on Linux. Which ...
1
vote
0
answers
19
views
Webpack change properties to devServer
i'm trying to use a plugin in my vuejs project that allows me to create projects in VUE within CMS October, however i updated my node and i believe i updated the webpack version too (from what i've ...
2
votes
1
answer
86
views
Webpack 5 error - Uncaught ReferenceError: require is not defined
I'm getting this error when trying to access main page of my app in the browser:
Uncaught ReferenceError: require is not defined
at Object.events (main.bundle.js:90508:1)
at __webpack_require__ (main....
0
votes
1
answer
17
views
I tried to install Pupilfirst LMS
I tried to install Pupilfirst LMS, I had difficulty in step
Compile Rescript Code: yarn run re: build
Output: Usage Error: could't find a script named "re: build".
And I also have ...
1
vote
1
answer
23
views
Unable to load image using Webpack 5
I'm using webpack 5 to bundle an embeddable widget.
I can't seem to load an image created on the fly.
const img = document.createElement('img');
img.src = 'assets/doggo.svg';
http://localhost:8080/...
0
votes
1
answer
19
views
webpack duplicate work during serving files
I've just faced to unpredictable situation during using custom webpack config.
I will try to explain the problem.
This is my simple app (file index.js):
console.log('!!this', this);
This is my ...
-1
votes
1
answer
69
views
Uncaught TypeError: Cannot read properties of null (reading 'useState')
In the module federation remote and host app configs attached below and its a react typescript applications.
A simple button component is used in the host app, able to see the component with default ...
0
votes
0
answers
12
views
react-responsive-carousel not working properly in webpack 5
I just migrated my project from webpack v4 to v5. It is migrated successfully. However , I am getting an issue with react-responsive carousel now when I run in development it's working fine in ...
0
votes
0
answers
71
views
How can I proxy a WebSocket request while using Webpack dev server and HMR?
I am using Webpack to build a React frontend while running the backend as a separate process and proxying the requests to it using Webpack dev server. The regular API requests proxy just fine but when ...
0
votes
0
answers
27
views
webpack devserver redirect rather than proxy for certain urls?
I am in the process of splitting my monolithic app into smaller apps that will behave similar to microfrontends.
There will be routes in one app that link to the other apps. The first app will be ...
0
votes
0
answers
7
views
Getting error when I am generating code coverage using istanbul
Package.json :
script :
"start:instrumented-dev": "oci-plugin-cli run start -c dev.config.js --instrument",
devDependecies :
"webpack": "^4.43.0",
"webpack-...
0
votes
0
answers
37
views
Page is not refereshing on file change in React with Webpack & Express configuration
I have created an react application from scratch with the help of webpack and express server. However, everthing is working fine except page is not reloading whenever i do some changes in my react ...
0
votes
0
answers
22
views
How to add attribute/key for webpack when running to later use as check variable inside config? [duplicate]
I want to run webpack with some key like
./bin/webpack -stateless
OR
./bin/webpack stateless=true
and check later in config if stateless is true do something, if not do another thing.
0
votes
0
answers
25
views
webpack-dev-server runs out of memory doing react development in dev container
I am developing a react application inside of a vscode dev container and the development server keeps crashing with the following message:
The build failed because the process exited too early. This ...
0
votes
0
answers
44
views
Correct way to connect to websocket using Kotlin/JS
I've got a Kotlin/JS project (version 1.6.21) and I'm trying to connect to a Websocket backend, both when running locally and in production.
(UPDATE I also get the same error with Kotlin/JS 1.7.0)
If ...
0
votes
1
answer
33
views
Hot Module Replacement always full reload
HMR always full reload everytime I change something in index.js. The only clue I got is it has something to do with module.hot.accept(), but I'm new to webpack and reading the very technical docs ...
0
votes
0
answers
18
views
Webpack Dev Server for React inside a legacy project
I recently added a React app into a legacy project.
The old code is based on a classic Nodejs + Express + Vanilla JS stack, and we wrote a whole new section of the project using React.
Everything ...
0
votes
1
answer
32
views
how do I write output in file using Webpack
I am trying to write output in file while using Dev-server but I got an error says -
been initialized using a configuration object that does
not match the API schema.
- configuration has an unknown ...
0
votes
0
answers
35
views
How to update node-forge module from webpack-dev-server?
Currently I am using webpack-dev-server 3.11.3 in my react application. This package has dependency on node-forge 0.10.0 which is vulnerable.
`-- webpack-dev-server@3.11.3
`-- selfsigned@1.10.14
...
0
votes
0
answers
22
views
devServer doesn't update browser when I move index.html to parent folder
Dev server doens't work if I move index.html to parent folder
I need the following structure:
public
index.html
build
main.js
other js files
I made a simple demo. There is a link, so you ...
0
votes
0
answers
43
views
Can I separate index.html and js bundle to different folders?
I need the following folder structure:
public
index.html
build
main.js
other.js
I have created simple demo, here is a link to github, so you can check the configs:
https://github.com/...
0
votes
0
answers
47
views
remove old version of eslint that causes a conflict
When I run npm run watch I get this message Do you want to install 'webpack-cli' (yes/no):
I type y then I get an error indicating a conflict of eslint versions
npm ERR! Found: eslint@4.19.1
npm ...
0
votes
1
answer
864
views
React Module Federation - Uncaught Error: Shared module is not available for eager consumption: webpack/sharing/consume/default/react/react
I am trying react module federation. I have created two react apps(modulefederation1, modulefederation2) using create-react-app command. I am getting 'Uncaught Error: Shared module is not available ...
0
votes
0
answers
22
views
Module build failed due to syntax error while parsing config
I installed webpack and babel for React in my Atom project. When I try to run a server via npm run serve I get this syntax error:
Module build failed (from ./node_modules/babel-loader/lib/index.js):
...
0
votes
1
answer
21
views
How do I configure Typescript React App created with create-react-app to emit the files to particular directory with yarn start (dev mode)
I have a React App (Typescript templated created using create-react-app) which emits all the changes to localhost:3000 when I execute yarn start. All local changes are immediately served with hot ...
0
votes
0
answers
8
views
Creating a custom hook in Webpack causes rescursive compilation
I have created a custom compiler hook that modifys the file system in my code.
This triggers a recompilation, which triggers my hook, which triggers a recompilation, and so on and so forth.
I added ...
0
votes
0
answers
94
views
"Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node." on component rerender
I have found an issue that makes me unable to use react-router-dom links that's stated in the title.
Minimal reproduction model:
// index.js
import React from "react";
import client from &...
0
votes
0
answers
35
views
webpack-dev-server doesn't not reloading after editing typescript class twice
I'm using pixiJS with webpack and typescript. When I run dev server on webpack-dev-server --mode development, it works preatty well. So, I change one of my classes called Water.ts and the hot reload ...
0
votes
0
answers
25
views
Cannot GET / - How to get webpack-dev-server to load my index.html
I'm having trouble loading up my index.html file when launching webpack-dev-server.
I am following Maximilian Schwarzmüller's course on Understanding TypeScript, and his versions of the tools seem to ...
0
votes
0
answers
28
views
is there any difference between this commands to install webpack? "npm install webpack webpack-cli --save-dev" & "npm install -D webpack webpack-cli "
Hello everyone I´m learning about webpack and i saw this two ways to install it, I was wondering if there is any difference between this two ways:
this one is from webpack documentation
"npm ...
4
votes
1
answer
192
views
webpack-dev-server Disconnect and Trying to reconnect... spam
I just finished an angular project I was working on, but i
noticed something in the console, which I'd love to hide if that's
possible just to keep everything tidy.
It's the [webpack-dev-server] ...
1
vote
1
answer
32
views
Vue-cli webpack dev server doesnt ignore selected files
I`m trying to ignore all *.html files so that webpack devserver wont reload when the files changes.
My config looks like this
const path = require('path');
module.exports = {
pages:
{
...
0
votes
0
answers
12
views
Webpack Config historyfallbackapi not working
Here is my webpack config file:
var path = require('path');
const dotEnv = require('dotenv-webpack');
var SRC_DIR = path.join(__dirname, '/client/src');
var DIST_DIR = path.join(__dirname, '/client/...
0
votes
0
answers
15
views
Removing stylesheet from webpack dev server at run time
I have a problem. Essentially I am running Webpack 5, with Webpack dev server and Webpack copy plugin to copy all my assets, images, styles etc... into the dist directory. I am building some ...
1
vote
0
answers
99
views
webpack devServer proxy doesn't catch my request
I have a UI app on http://localhost:8050/ and api server on http://foo.local.bar.com.
I logged in to the server directly, but I need the UI to send to cookie to the server too when I fetch GET method ...
0
votes
0
answers
44
views
Webpack-dev-server doesn't refresh the app with custom host
I'm developing a react app and until I was running my dev server just on https://localhost everything was ok, i.e. the app was hot refreshed everytime I clicked "save" in my IDE.
Then I've ...
0
votes
1
answer
29
views
Give local file access to Webserver
I just began learning JavaScript and I have been trying to upload a file to a webserver I am locally hosting. I am using a webpack JS file to start the server and the command "npm run dev" ...
0
votes
0
answers
77
views
how to import module.exports in webpack
I am trying to refactor some webpack settings (in my package.json) that I currently have, as I have 4 files with almost the same code, some constants are different:
"scripts": {
"...
0
votes
0
answers
35
views
mock request with webpack server
I'm developing a chrome extension for tiktok. I'm creating a development environment and i need to mock some requests, for example, when you load a profile page there is a network call that i want to ...
0
votes
0
answers
74
views
Create React App Webpack Dev Server - How to select HTML documents on the same path based on query string?
I have a create react app, and I have two requirements that I am trying to achieve:
1 Language management for index.html:
When a user visits my-app/any/subpath?lng=en or my-app/any/subpath they ...
1
vote
0
answers
74
views
webpack-dev-server version 4 causing app to infinite refresh
I have recently upgraded my React application to use webpack-dev-server: 4.8.1 however now my application is stuck in an infinite refresh loop when trying to start it in a browser.
The error in my ...
2
votes
1
answer
42
views
Is there a way we can modify manifest.json generated in dev-server mode
I am using webpack-manifest-plugin plugin to generate a manifest.json file.
After that i have another plugin that runs after the complete build is done.
There I want to modify the manifest.json.Now ...
0
votes
0
answers
18
views
I'm trying to require file in webpack enviroment, but the a varible path make an error
this.data = require("/static/content/" + this.place + "/main.json")
This is work.
this.path = "/static/content/" + this.place
this.data = require(this.path + &...