Stack Overflow
Stack Overflow

Questions tagged [webpack-5]

Use this tag for questions specific to features in Webpack 5. When using this tag, also include the more generic [webpack] tag where possible.

Use this tag for questions specific to features in Webpack 5. For general Webpack questions, the correct tag is .

Webpack 5

Migrating instructions can be found in the documentation.

862 questions
7
votes
2 answers

when i update to webpack5, there is a error: configuration has an unknown property 'before'

when I update webpack 4 to 5, the error exits. I have a webpackDevServer.js which include the error message 'error' // webpackDevServer.js module.exports = function(proxy, allowedHost) { return { before(app, server) { if…
fawinell
  • 253
  • 4
  • 12
7
votes
0 answers

Why are flattened ES modules (FESM) more performant than unflattened ES modules (ESM)?

According to the Angular Package Format document, Angular packages are distributed as two kinds of ES modules: Flattened ES modules (FESM), where the import statements are removed and the imported code is inlined. Unflattened ES modules (ESM),…
emccorson
  • 150
  • 8
7
votes
2 answers

Why is my webpack build detecting so many orphan modules?

I've just updated to webpack 5. This is my webpack.config.ts: import * as path from "path"; import * as webpack from "webpack"; const config: webpack.Configuration = { mode: "production", devtool: false, output: { filename:…
cbdeveloper
  • 27,898
  • 37
  • 155
  • 336
7
votes
3 answers

Module parse failed: Unexpected character '@' (1:0) with Storybook 6.1.11, Webpack 5.11.0, React 17.0.1

Trying to setup a react-app with all latest versions. Github Repo Link Trying to run storybook with sass file imported will result in below error. Trying to run without importing the styles, storybook works. The same code works correctly when its…
Sharath
  • 2,348
  • 8
  • 45
  • 81
7
votes
1 answer

How to save contenthash in webpack configuration

I previously saved the [hash] value of webpack to a meta.json file: class MetaInfoPlugin { constructor(options) { this.options = { filename: 'meta.json', ...options }; } apply(compiler) { compiler.hooks.done.tap(this.constructor.name,…
Patrick
  • 691
  • 8
  • 30
6
votes
2 answers

Webpack 5: how to use a custom loader that is written as ES Module

How do I tell Webpack that it should treat my loader as an ES Module and not CommonJS? My goal is to write a Loader that uses the ES Module syntax (export default...) Demo (not working):…
Lucas Pottersky
  • 1,844
  • 6
  • 22
  • 38
6
votes
1 answer

Webpack Module Federation Error ScriptExternalLoadError: Loading script failed

NOTE: I tried accessing this directly in the browser https://localhost:5007/accom-web/dist/js/assets/browser-bundle/remoteEntryTest.js and I'm served the remoteEntryTest.js file. This is my webconfig in host. This is webconfig of remote…
hendrixchord
  • 4,662
  • 4
  • 25
  • 39
6
votes
2 answers

Webpack 5 Breaking Changes "process/browser"

Screenshot for Error: Can't resolve 'process/browser': I'm hoping someone could help me here. With the Webpack 5 breaking changes with polyfills I was able to use react-rewired to add fallbacks to a config-overrides.js I npm installed every…
euføeni
  • 61
  • 1
  • 4
6
votes
3 answers

How to use fallback: { 'path': require.resolve('path-browserify'), in webpack?

I'm getting this error: If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }' - install 'path-browserify' : (base) raphy@pc:~/NEW-Raphy-Template$ yarn start yarn run…
Raphael10
  • 2,508
  • 7
  • 22
  • 50
6
votes
1 answer

How to properly configure .png images in webpack?

Iv'e created a storybook (build without create-react-app) which deployed to npm. When trying to use its components in a different react application the .png images that suppose to be rendered together with the component are not loading at all (for…
Orianne Shahar Gilad
  • 103
  • 5
6
votes
1 answer

Why is there no CSS file output from Webpack 5?

Searched everywhere and for days now and I still can't manage to understand why my latest attepmpt also doesn't work. Why isn't there a CSS file on dist folder? Now I am importing the styles in a .js file that is later imported in my app entry point…
Afonso Gomes
  • 902
  • 1
  • 14
  • 40
6
votes
3 answers

Failed to parse source map from 'C:\Users\syrine\management\node_modules\stylis-plugin-rtl\src\stylis-rtl.ts'

I'm trying to add a react material template to my reactJs Project. I fix all the errors but I can't fix this one WARNING in ./node_modules/stylis-plugin-rtl/dist/stylis-rtl.js Module Warning (from…
Syrine Ben Hassen
  • 61
  • 1
  • 6
6
votes
1 answer

Use different output.libraryTarget for a Web Worker

I have this Webpack configuration: { output: { libraryTarget: "system", ... }, ... } I'm trying to use a Web Worker. I'm using the standard Webpack 5 syntax: new Worker(new URL('./MyWorker', import.meta.url)); Now Webpack outputs the…
Michał Perłakowski
  • 88,409
  • 26
  • 156
  • 177
6
votes
1 answer

Update webpack 4 to webpack 5 get error options has an unknown property 'inline'

When I try to update from webpack 4 to webpack 5, I get an error. Here is my new webpack.config: const { merge } = require('webpack-merge'); const common = require("./webpack.common.js"); const path = require("path"); const HtmlWebpackPlugin =…
May'Habit
  • 1,334
  • 12
  • 18
6
votes
1 answer

Webpack 5+Process is not defined triggered by stream-browserify

I have to decode a CBOR encoded array using the cbor node module. When i launch my command: const decodedData = base45.decode(greenpassBody); const output = pako.inflate(decodedData); const results = cbor.decodeAllSync(output); // this line this…
Matteo Pietro Peru
  • 486
  • 5
  • 19
1 2 3
…
57 58