Stack Overflow
Stack Overflow

Questions tagged [webpack-splitchunks]

Use it for optimization.splitChunks configuration questions.

Bundle can be divided for smaller pieces (chunks) to achieve:

  1. lazy loading;
  2. parallel loading;
  3. moving stable part of bundle to special 'vendor' chunk that could be cached individually;
  4. avoid loading duplicated code between multiple entrypoints.

Further reading: https://medium.com/webpack/webpack-4-code-splitting-chunk-graph-and-the-splitchunks-optimization-be739a861366

120 questions
1
vote
1 answer

Splitting chunks - problem with regex (js)?

I'm trying to split my build files in my webpack.config.js file, but my vendors file isn't being created at all. The remaining node_modules, which aren't react or moment files end up in the main.js. An example of a file that goes in main.js is…
stumped
  • 3,235
  • 7
  • 43
  • 76
1
vote
1 answer

Webpack-4 MiniCssExtractPlugin splitChunks

I'm trying to get the Webpack-4 splitChunks optimization to do this: Put all JS&CSS not in any entry point but used more than once into common files (CSS & JS). Combine all CSS produced by the MiniCssExtractPlugin from Vue components into the same…
philw
  • 661
  • 10
  • 20
1
vote
1 answer

Webpack 4 splitChunks and libraryTarget

I have some entries: app, vendor, polyfills, bootstrap and output as library ['app', '[name]'] and libraryTarget var. In the browser app variable contains: {bootstrap: Module, polyfills: Module, vendor: Module, app: Module} If I use…
Alexey Savchuk
  • 1,068
  • 6
  • 13
  • 26
0
votes
0 answers

Chunks Loading With Module Federation

Not able to generate separate chunks for node_modules which are needed for initial page load. In my react app, i am using webpack 5 module federation. As per the docs, to consume the eager dependencies, we have to create a bootstrap.js file which we…
Rajesh Roul
  • 1
0
votes
0 answers

why i have this error everytime i make new deployment

i'm facing with this error when i deploy to production .. console error this is my craco.config.js const webpack = require("webpack"); const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin; module.exports =…
aviva
  • 1
  • 1
0
votes
0 answers

Why am I still getting chunked code despite setting the optimization.splitchunks to false in gatsby webpack config?

I have my static web application written in Gatsby React, and I wanted to disable the webpack option of generating javascript code in chunks, because we were getting some chunk load errors, and found it to be a unsustainable practise. I disabled…
ms3300
  • 216
  • 6
  • 13
0
votes
0 answers

Webpack is not importing reflect-metadata properly with chunking

recently I've been trying to convert my aws-lambda project from outputting cjs to esm. The only thing left that doesn't work is my usage of reflect-metadata. In this project I also do chunking: optimization: { minimize: false, …
kyl
  • 475
  • 1
  • 5
  • 16
0
votes
1 answer

webpack - splitting a single file into multiple chunks?

I have a project that looks like this: baseConfig.ts: import { a } from "package" export baseConfig = config(a) fullConfig.ts: import { a, b, c } from "package" export fullConfig = config(a) _app.tsx: import { baseConfig } from…
llllvvuu
  • 286
  • 1
  • 9
0
votes
0 answers

Prevent unnecessary chunk to load for a route in isomorphic app

I am trying to do some bundling optimisation using webpack for isomorphic app,but am not able to avoid not needed chunk from loading for a route which doesn't require it.I would really appreciate some resource or solution you could point me to. Ex:…
Sufyan Mahmood
  • 11
  • 2
0
votes
0 answers

How to transcribe Whisper Open AI transcription for large video files larger than 25mb using python?

I have tried creating the video files in to chunks and transcribe the video but while trancribing the chunks the video start time for the 2nd chunk is starting from 0 and aslo it doesnot make the video file when there is silence and if a video file…
CloudExplorer
  • 31
  • 5
0
votes
1 answer

Webpack splitchunks creates dynamic chunk file

expecting to have only two chunks vendors and commons. However webpack creates a new chunk file for specific entries with delimiter. optimization: { splitChunks: { chunks: 'all', cacheGroups: { vendor: { …
Krishna
  • 939
  • 1
  • 11
  • 16
0
votes
0 answers

Module federation in combination with chunk grouping

I am trying to use ModuleFederationPlugin in an Angular project, I am able to get this working following the documentation available. What I am trying now to is to use chunk grouping configuration, like the example below module.exports = { // ...…
iamrakesh
  • 219
  • 4
  • 16
0
votes
0 answers

Webpack splitChunks optimization is throwing errors when i integrate its build into another project

I have a common components project and to its webpack i added chunk splitting to reduse bundle size. When i integrate this project to the other project and run it i get errors that components are undefined, why? without splitChunks optimization it…
Evaldas611
  • 1
  • 2
0
votes
0 answers

webpack named entry and hashed chunks in cacheGroup

In Webpack 5, I need to have the chunks that belong to a cacheGroup named so they can be grouped together due to a quirk in our content system. So what I want do do is something like: splitChunks: { cacheGroups: { something: { test:…
marcusds
  • 784
  • 1
  • 7
  • 26
0
votes
1 answer

Webpack 5 Split chunks not working with scss imports

I have a very basic webpack(v5.75.0) file setup: webpack.config.js: const path = require('path'); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); module.exports = { entry: { home: './src/home.js', about: './src/about.js' …
Benji40
  • 217
  • 1
  • 5
  • 12
1 2 3 4 5
6
7 8