diff --git a/packages/chunks/README.md b/packages/chunks/README.md new file mode 100644 index 0000000..1c159a8 --- /dev/null +++ b/packages/chunks/README.md @@ -0,0 +1,36 @@ +# Chunks Plugin + +Support for split chunks + +## Install + +``` +npm install -D @rambler-tech/razzle-chunks +``` + +or + +``` +yarn add -D @rambler-tech/razzle-chunks +``` + +## Usage + +Add the plugin to `razzle.config.js` + +```js +const path = require('path') +const ChunksPlugin = require('@rambler-tech/razzle-chunks') + +module.exports = { + plugins: [ + ChunksPlugin({ + vendors: /[\\/]node_modules[\\/]*[\\/]/ + }) + ], + modifyWebpackConfig({webpackConfig}) { + // ... + return webpackConfig + } +} +``` diff --git a/packages/chunks/index.js b/packages/chunks/index.js new file mode 100644 index 0000000..828fa62 --- /dev/null +++ b/packages/chunks/index.js @@ -0,0 +1,31 @@ +module.exports = (groups) => ({ + modifyWebpackConfig({env: {target}, webpackConfig}) { + const isBrowser = target === 'web' + + if (isBrowser) { + const entries = Object.keys(webpackConfig.entry) + + webpackConfig.optimization = { + splitChunks: { + cacheGroups: {} + } + } + + for (const entry of entries) { + for (const group in groups) { + webpackConfig.optimization.splitChunks.cacheGroups[ + `${entry}.${group}` + ] = { + test: groups[group], + name: `${entry}.${group}`, + chunks: (chunk) => chunk.name === entry, + enforce: true, + priority: 1 + } + } + } + } + + return webpackConfig + } +}) diff --git a/packages/chunks/package.json b/packages/chunks/package.json new file mode 100644 index 0000000..4be1059 --- /dev/null +++ b/packages/chunks/package.json @@ -0,0 +1,14 @@ +{ + "name": "@rambler-tech/razzle-chunks", + "version": "0.0.0", + "main": "index.js", + "license": "MIT", + "sideEffects": false, + "publishConfig": { + "access": "public" + }, + "peerDependencies": { + "razzle": ">=4", + "webpack": ">=5" + } +}