Stack Overflow
Stack Overflow

Questions tagged [webpack-plugin]

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows to load parts for the application on demand. Through "loaders" modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.

132 questions
84
votes
1 answer

Can someone explain Webpack's CommonsChunkPlugin

I get the general gist that the CommonsChunkPlugin looks at all the entry points, checks to see if there are common packages/dependencies between them and separates them into their own bundle. So, let's assume I have the following…
Dimitris Karagiannis
  • 8,942
  • 8
  • 38
  • 63
48
votes
1 answer

How to write Webpack plugin which adds modules to the bundle on the fly based on other modules?

I have a problem with writing a Webpack plugin for a translation service. The goal is to: Get names (and source code) of all required modules during compilation. I need to be able to scan the included source code for special t() function usage but…
Maciej Bukowski
  • 3,240
  • 23
  • 28
29
votes
3 answers

webpack common chunks plugin vs webpack dll plugin

Before I used webpack common chunks plugin to create vendor bundle containing third party libraries like angular, react, lodash etc, but then I knew about webpack dll plugin. They seem do the same things but dll plugin also allows you to reduce…
pavel06081991
  • 629
  • 1
  • 8
  • 14
20
votes
2 answers

webpack 4 disable uglifyjs-webpack-plugin

I have had this problem for the last 2 days. So I decided to completely disable uglifyjs-webpack-plugin from webpack build process. I was not able to find anything on webpack 4.
yacine benzmane
  • 3,888
  • 4
  • 22
  • 32
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
12
votes
2 answers

webpack plugin to replace a function with another

I am trying to create a webpack plugin, that will parse the code for a certain function and replace it with another function, that plugin will also expose the new function as a global. class someName { constructor(local, domain, translationFile,…
Neta Meta
  • 4,001
  • 9
  • 42
  • 67
11
votes
2 answers

Webpack plugin to modify files after compilation

I am writing a Webpack plugin that should replace a part of the JS code with a list of Webpack's generated CSS files. Imaging this JS code: ReactWebComponent.create(, 'react-web-component', { injectReactWebComponent: true }); I want to…
Lukas
  • 9,752
  • 15
  • 76
  • 120
9
votes
2 answers

How to update the source code of a module per chunk?

Recently, I started learning how to build webpack plugins. I'm trying to build a plugin that will update my source code. The rules are simple: If the entry point name has less than 2 as, I have to rename all the variables haha to hehe in all…
Raphael Boukara
  • 398
  • 3
  • 11
9
votes
2 answers

Webpack plugin error management

The main goal of this post is to get extra informations about error/warning management while writing a Webpack plugin. I've seen in the Webpack plug-in documentation that it's possible to pass an err parameter to the timing based plug-in interface…
Lemmy
  • 291
  • 2
  • 12
9
votes
4 answers

How to prevent TypeScript from interrupting Webpack building on unresolved variables declared on Webpack's ProvidePlugin?

Is there a way to prevent WebPack's building process from failing after typescript compiler start yelling on unresolved variables that actually are already configured on webpack's ProvidePlugin configuration? webpack.config.js plugins: [ ... new…
Lothre1
  • 3,523
  • 7
  • 43
  • 64
8
votes
0 answers

Decide which webpack.resolve.modules will be used by a function

{ resolve: { extensions: [...], modules: [...], alias: { ... }, plugins: [...], } } I have a multiple folders and in each fo them, i use non-relative path inside the require. When I require from file in folder A…
Stav Alfi
  • 13,139
  • 23
  • 99
  • 171
8
votes
1 answer

Is there a way to get dependency tree from webpack?

I have a big project with different types of dependencies in it: js, scss, svg, png, etc... My webpack is configured and bundles my code, I am happy with it. But I want to get some kind of hash of all my dependencies (including binaries and all…
soq
  • 181
  • 1
  • 6
7
votes
2 answers

Webpack Plugin: How to add dynamically a Module to the main Chunk?

I'm working on a Webpack plugin that basically looks for a css assets inside the chunks, when it founds such asset, applies on it some postCSS plugin that returns 2 outputs, the one should continue to be extracted using Extract-Text-Plugin and the…
felixmosh
  • 32,615
  • 9
  • 69
  • 88
7
votes
1 answer

let webpack output individual compiled files besides bundle

I'm using the webpack loader ts-loader to compile typescript sourcefiles into a javascript bundle. Now I would like the individualy compiled javascript files also to be saved, as well as the bundle! I'm familliar with writing a very simple webpack…
Flion
  • 10,468
  • 13
  • 48
  • 68
7
votes
1 answer

Webpack plugin for module friendly names (path instead of a number)

During the hot update in webpack development server in console I see these messages: [HMR] Updated modules: [HMR] - 1009 [HMR] - 1007 I would rather see the path names in there and I remember there was a plugin for that, but could not find it…
Ilya Chernomordik
  • 27,817
  • 27
  • 121
  • 207
1
2 3
…
8 9