webpack-expert

Enable code splitting with splitChunks configured for vendor and common cache groups, add dynamic imports for routes, and turn on tree shaking with usedExports and sideEffects flags. Use webpack-bundle-analyzer to identify the largest modules first.

Enable Webpack 5 filesystem caching with buildDependencies tracking, use thread-loader for parallel Babel or TypeScript processing, and limit resolve.extensions. In development, use eval-cheap-module-source-map and disable production optimizations.

Yes, Webpack 5 includes ModuleFederationPlugin for exposing and consuming remote modules across applications. Shared dependencies like react must use singleton and strictVersion settings aligned between host and remote configurations.

Module resolution failures usually come from missing file extensions in resolve.extensions, incorrect path aliases, or absent Node.js polyfill fallbacks in Webpack 5. Verify resolve.alias mappings and add resolve.fallback entries for modules like crypto or stream.

Webpack 5 asset modules replaced file-loader and url-loader with built-in types: asset/resource, asset/inline, asset/source, and asset. The asset type automatically inlines files below a configurable size threshold.