diff --git a/__fixtures__/stats.js b/__fixtures__/stats.js index dbb345f..5a667df 100644 --- a/__fixtures__/stats.js +++ b/__fixtures__/stats.js @@ -22,15 +22,44 @@ const chunk3Files = [ '2.no_css.js.map', '2.css.map' ] +const chunk4Files = [ + '3.js', + '3.no_css.js', + '3.css', + '3.js.map', + '3.no_css.js.map', + '3.css.map' +] export const stats = { assetsByChunkName: { - bootstrap: ['bootstrap.js', 'bootstrap.no_css.js'], + 'bootstrap~..arbitrary': [ + 'bootstrap~..arbitrary.js', + 'bootstrap~..arbitrary.no_css.js' + ], vendor: ['vendor.js', 'vendor.no_css.js'], main: ['main.js', 'main.no_css.js', 'main.css'], - chunk1: chunk1Files, + 'chunk1~common1': chunk1Files, + 'chunk1~common2': chunk4Files, chunk2: chunk2Files }, + namedChunkGroups: { + bootstrap: { + chunks: ['bootstrap~..arbitrary'] + }, + vendor: { + chunks: ['vendor'] + }, + main: { + chunks: ['main'] + }, + chunk1: { + chunks: ['chunk1~common1', 'chunk1~common2'] + }, + chunk2: { + chunks: ['chunk2'] + } + }, chunks: [ { id: 0, diff --git a/__tests__/__snapshots__/createApiWithCss.test.js.snap b/__tests__/__snapshots__/createApiWithCss.test.js.snap index 985dadc..0a826b6 100644 --- a/__tests__/__snapshots__/createApiWithCss.test.js.snap +++ b/__tests__/__snapshots__/createApiWithCss.test.js.snap @@ -121,7 +121,8 @@ Array [ exports[`unit tests createCssHash() 1`] = ` Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", } diff --git a/__tests__/__snapshots__/flushChunks.test.js.snap b/__tests__/__snapshots__/flushChunks.test.js.snap index f45a381..52394d1 100644 --- a/__tests__/__snapshots__/flushChunks.test.js.snap +++ b/__tests__/__snapshots__/flushChunks.test.js.snap @@ -13,7 +13,8 @@ Object { "toString": [Function], }, "cssHashRaw": Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", }, @@ -23,9 +24,10 @@ Object { "outputPath": undefined, "publicPath": "/static", "scripts": Array [ - "bootstrap.no_css.js", + "bootstrap~..arbitrary.no_css.js", "vendor.no_css.js", "0.no_css.js", + "3.no_css.js", "1.no_css.js", "main.no_css.js", ], @@ -35,6 +37,7 @@ Object { "stylesheets": Array [ "main.css", "0.css", + "3.css", "1.css", ], } @@ -53,7 +56,8 @@ Object { "toString": [Function], }, "cssHashRaw": Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", }, @@ -63,7 +67,7 @@ Object { "outputPath": undefined, "publicPath": "/static", "scripts": Array [ - "bootstrap.no_css.js", + "bootstrap~..arbitrary.no_css.js", "vendor.no_css.js", "0.no_css.js", "1.no_css.js", @@ -95,7 +99,8 @@ Object { "toString": [Function], }, "cssHashRaw": Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", }, @@ -136,7 +141,8 @@ Object { "toString": [Function], }, "cssHashRaw": Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", }, @@ -146,9 +152,10 @@ Object { "outputPath": undefined, "publicPath": "/static", "scripts": Array [ - "bootstrap.no_css.js", + "bootstrap~..arbitrary.no_css.js", "vendor.no_css.js", "0.no_css.js", + "3.no_css.js", "1.no_css.js", "main.no_css.js", ], @@ -158,6 +165,7 @@ Object { "stylesheets": Array [ "main.css", "0.css", + "3.css", "1.css", ], } @@ -176,7 +184,8 @@ Object { "toString": [Function], }, "cssHashRaw": Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", }, @@ -186,7 +195,7 @@ Object { "outputPath": undefined, "publicPath": "/static", "scripts": Array [ - "bootstrap.no_css.js", + "bootstrap~..arbitrary.no_css.js", "vendor.no_css.js", "0.no_css.js", "1.no_css.js", @@ -218,7 +227,8 @@ Object { "toString": [Function], }, "cssHashRaw": Object { - "chunk1": "/static/0.css", + "chunk1~common1": "/static/0.css", + "chunk1~common2": "/static/3.css", "chunk2": "/static/1.css", "main": "/static/main.css", }, @@ -254,6 +264,12 @@ Array [ "0.js.map", "0.no_css.js.map", "0.css.map", + "3.js", + "3.no_css.js", + "3.css", + "3.js.map", + "3.no_css.js.map", + "3.css.map", "1.js", "1.no_css.js", "1.css", @@ -289,6 +305,7 @@ Array [ exports[`flushFiles() called as a pure function filter: by function 1`] = ` Array [ "0.css", + "3.css", "1.css", ] `; @@ -296,6 +313,7 @@ Array [ exports[`flushFiles() called as a pure function filter: by regex 1`] = ` Array [ "0.css", + "3.css", "1.css", ] `; @@ -303,6 +321,7 @@ Array [ exports[`flushFiles() called as a pure function filter: by string (file extension) 1`] = ` Array [ "0.css", + "3.css", "1.css", ] `; @@ -315,6 +334,12 @@ Array [ "0.js.map", "0.no_css.js.map", "0.css.map", + "3.js", + "3.no_css.js", + "3.css", + "3.js.map", + "3.no_css.js.map", + "3.css.map", "1.js", "1.no_css.js", "1.css", diff --git a/__tests__/flushChunks.test.js b/__tests__/flushChunks.test.js index ff0a6f4..a73ad66 100644 --- a/__tests__/flushChunks.test.js +++ b/__tests__/flushChunks.test.js @@ -9,7 +9,7 @@ import { isUnique, normalizePath, concatFilesAtKeys, - filesFromChunks + assetsFromChunkGroups } from '../src/flushChunks' import { @@ -223,13 +223,21 @@ describe('unit tests', () => { expect(files).toEqual(['0.js', '0.css', '2.js', '2.css']) }) - test('filesFromChunks()', () => { + test('assetsFromChunkGroups()', () => { const entryNames = ['bootstrap', 'vendor', 'main'] const assetsByChunkName = { bootstrap: ['bootstrap.js'], main: ['main.js', 'main.css'] } - const outputFiles = filesFromChunks(entryNames, { assetsByChunkName }) + const namedChunkGroups = { + bootstrap: { chunks: ['bootstrap'] }, + main: { chunks: ['main'] }, + vendor: { chunks: ['vendor'] } + } + const outputFiles = assetsFromChunkGroups(entryNames, { + assetsByChunkName, + namedChunkGroups + }) expect(outputFiles).toEqual(['bootstrap.js', 'main.js', 'main.css']) }) diff --git a/src/flushChunks.js b/src/flushChunks.js index 0a08748..977dee0 100644 --- a/src/flushChunks.js +++ b/src/flushChunks.js @@ -62,16 +62,17 @@ export default (stats: Stats, opts: Options): Api => const flushChunks = (stats: Stats, isWebpack: boolean, opts: Options = {}) => { const beforeEntries = opts.before || defaults.before - const ffc = (assets, isWebpack) => filesFromChunks(assets, stats, isWebpack) + const afc = (chunkGroupNames, isWebpack) => + assetsFromChunkGroups(chunkGroupNames, stats, isWebpack) - const jsBefore = ffc(beforeEntries) + const jsBefore = afc(beforeEntries) const files = opts.chunkNames - ? ffc(opts.chunkNames, true) + ? afc(opts.chunkNames, true) : flush(opts.moduleIds || [], stats, opts.rootDir, isWebpack) const afterEntries = opts.after || defaults.after - const jsAfter = ffc(afterEntries) + const jsAfter = afc(afterEntries) return createApiWithCss( [...jsBefore, ...files, ...jsAfter].filter(isUnique), @@ -90,7 +91,7 @@ const flushFiles = (stats: Stats, opts: Options2) => const flushFilesPure = (stats: Stats, isWebpack: boolean, opts: Options2) => { const files = opts.chunkNames - ? filesFromChunks(opts.chunkNames, stats) + ? assetsFromChunkGroups(opts.chunkNames, stats) : flush(opts.moduleIds || [], stats, opts.rootDir, isWebpack) const filter = opts.filter @@ -200,7 +201,7 @@ const concatFilesAtKeys = ( [] ) -const filesByChunkName = (name, namedChunkGroups) => { +const chunksForChunkGroupName = (name, namedChunkGroups) => { if (!namedChunkGroups || !namedChunkGroups[name]) { return [name] } @@ -208,8 +209,8 @@ const filesByChunkName = (name, namedChunkGroups) => { return namedChunkGroups[name].chunks } -const hasChunk = (entry, assets, checkChunkNames) => { - const result = !!(assets[entry] || assets[`${entry}-`]) +const hasChunkGroup = (entry, namedChunkGroups, checkChunkNames) => { + const result = !!namedChunkGroups[entry] if (!result && checkChunkNames) { console.warn( `[FLUSH CHUNKS]: Unable to find ${entry} in Webpack chunks. Please check usage of Babel plugin.` @@ -219,7 +220,7 @@ const hasChunk = (entry, assets, checkChunkNames) => { return result } -const chunksToResolve = ({ +const chunkNamesForChunkGroupNames = ({ chunkNames, stats, checkChunkNames @@ -230,16 +231,17 @@ const chunksToResolve = ({ }): Array => chunkNames .reduce((names, name) => { - if (!hasChunk(name, stats.assetsByChunkName, checkChunkNames)) { + if (!hasChunkGroup(name, stats.namedChunkGroups, checkChunkNames)) { return names } - const files = filesByChunkName(name, stats.namedChunkGroups) - names.push(...files) + names = names.concat( + chunksForChunkGroupName(name, stats.namedChunkGroups) + ) return names }, []) .filter(isUnique) -const filesFromChunks = ( +const assetsFromChunkGroups = ( chunkNames: Files, stats: Object, checkChunkNames?: boolean @@ -255,7 +257,7 @@ const filesFromChunks = ( ) } - const chunksWithAssets = chunksToResolve({ + const chunksWithAssets = chunkNamesForChunkGroupNames({ chunkNames, stats, checkChunkNames @@ -278,5 +280,5 @@ export { isUnique, normalizePath, concatFilesAtKeys, - filesFromChunks + assetsFromChunkGroups }