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
90
votes
12 answers

Error: Should not import the named export 'version' (imported as 'version')

I have an ejected create-react-app project. I am getting this error after updating it to webpack 5. It was working fine with webpack v4.41.5 OS: MacOS Catalina 10.15.7 node: v10.23.0 Error: Should not import the named export 'version' (imported…
Muhammad Kamal
  • 1,169
  • 1
  • 8
  • 11
31
votes
6 answers

Webpack 5: file-loader generates a copy of fonts with hash-name

I cant figure out whats going on here. I use the file-loader to load the fonts of my application: { test: /.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/, use: [{ loader: 'file-loader', options: { name: '[name].[ext]', …
Toge
  • 333
  • 1
  • 3
  • 7
30
votes
2 answers

Webpack 5: devtool ValidationError, invalid configuration object

While migrating from Webpack 4 to Webpack 5 I got an error when using devtool with empty value (only in production mode). module.exports = { devtool: isProd ? '' : 'source-map', // entry: ... // output: ... // module: ... } The…
tom
  • 9,550
  • 6
  • 30
  • 49
28
votes
3 answers

DeprecationWarning: Compilation.assets will be frozen in future, all modifications are deprecated

I am working on a react project and when I updated webpack 4.44.2 to 5.4.0 I am getting the following message: [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future, all modifications are…
Varinder Sohal
  • 1,142
  • 5
  • 24
  • 44
25
votes
4 answers

Webpack module federation is not working with eager shared libs

I was looking into Webpack 5 Module federation feature, and have some trouble understanding why my code does not work. The idea is pretty similar to what standard module federation examples do: app1 - is the host app app2 - is a remote exposing the…
volk
  • 762
  • 1
  • 6
  • 19
25
votes
6 answers

How to get a list of all files (or modules) included per chunk in Webpack

Can't seem to find any debug option or plugin in webpack to show what exactly went into a chunk. Why do I need this? I've noticed cases where code splitting literally makes everything much larger then just sticking everything in a single file. This…
srcspider
  • 10,977
  • 5
  • 40
  • 35
23
votes
5 answers

WP5 Module Federation: remoteEntry.js caching

With Webpack 5 module federation if remote entry is modified, you don't need to redeploy main module/application and the newest version of the module will be loaded when it's requested by the browser. I'm wondering: since the remote URL remains the…
Pavlo Kozlov
  • 966
  • 1
  • 9
  • 22
19
votes
2 answers

CleanWebpackPlugin does not clean in Webpack 5

I am using latest version of webpack 5.3.2 with "clean-webpack-plugin": "^3.0.0". And apparently the plugin does not clean dist folder when I build. Here's my webpack info: Binaries: Node: 12.18.1 - ~/.nvm/versions/node/v12.18.1/bin/node …
Melchia
  • 22,578
  • 22
  • 103
  • 117
17
votes
2 answers

Use latest terser-webpack-plugin with Webpack5

According to this link (Terser documentation) if you are using latest Webpack 5, you don't need to install the Terser plugin as it is included in Webpack 5 out of the box. However, I am having a hard time to get this working. If I remove the…
user3587624
  • 1,427
  • 5
  • 29
  • 60
17
votes
1 answer

Module Federation Shared Services

I'm working on a new project using Angular 11 and Webpack 5. I am basing my work on Manfred Steyer's Module Federation Plugin Example repo, which uses Angular CLI. I can't figure out how to share a singleton service from a shared local Angular…
Mike
  • 1,266
  • 1
  • 11
  • 17
16
votes
2 answers

how to config the webpack 5.x to remove the dist folder before build

Before the next build, I want to remove the previous build because if we do not remove the old build, some change that did not generate the output file may not be found as soon as possible. I am tried to do this work using this command in the…
Dolphin
  • 29,069
  • 61
  • 260
  • 539
16
votes
2 answers

Tree shaking of shared dependencies in webpack 5 module federation

I am working on an architecture for a dynamic dashboard with components fetched from different remote react bundles using webpack 5 module federation. I do have different libraries which are shared across some of these remote bundles. These packages…
jn_dev
  • 191
  • 8
13
votes
2 answers

Webpack Module Federation Unsatisfied version 11.x.x of shared singleton module @angular/common (required ^7.2.0)

I am trying to get my rather complicated monolithic app to work with Module Federation. My webpack config looks like that plugins: [ new ModuleFederationPlugin({ remotes: { "mfe1":…
gleixnerp
  • 171
  • 1
  • 2
  • 8
13
votes
2 answers

After build via Webpack 5 app stoped working on Internet Explorer (IE11)

As announced in Webpacks 5.0 release blog post build still works in most browsers after a few minor adjustments in webpack.config.js. But it stopped working in Internet Explorer (11) because the generated output is mixed ES6 and ES5 and therefore…
Bernhard
  • 4,855
  • 5
  • 39
  • 70
12
votes
5 answers

Emit attempted before Angular Webpack plugin initialization after webpack5 build

I'm using Angular 14 and Webpack version: ^5.58.1. Below is the config: webpack.congif.js const webpackPlugin = require('@ngtools/webpack').AngularWebpackPlugin; module.exports = { mode: 'development', devtool: "source-map", entry: { main:…
Rohit More
  • 121
  • 1
  • 1
  • 4
1
2 3
…
57 58