diff --git a/__tests__/__snapshots__/flushChunks.test.js.snap b/__tests__/__snapshots__/flushChunks.test.js.snap index eac08b8..3981444 100644 --- a/__tests__/__snapshots__/flushChunks.test.js.snap +++ b/__tests__/__snapshots__/flushChunks.test.js.snap @@ -3,11 +3,20 @@ exports[`flushChunks() called as pure function babel - chunkNames 1`] = ` Object { "Css": [Function], + "CssChunks": [Function], "Js": [Function], "Styles": [Function], "css": Object { "toString": [Function], }, + "cssChunks": Object { + "toString": [Function], + }, + "cssChunksHash": Object { + "chunk1": "/static/0.css", + "chunk2": "/static/1.css", + "main": "/static/main.css", + }, "js": Object { "toString": [Function], }, @@ -34,11 +43,20 @@ Object { exports[`flushChunks() called as pure function babel: uses default entries when no named chunks provided via opts.before/after 1`] = ` Object { "Css": [Function], + "CssChunks": [Function], "Js": [Function], "Styles": [Function], "css": Object { "toString": [Function], }, + "cssChunks": Object { + "toString": [Function], + }, + "cssChunksHash": Object { + "chunk1": "/static/0.css", + "chunk2": "/static/1.css", + "main": "/static/main.css", + }, "js": Object { "toString": [Function], }, @@ -67,11 +85,20 @@ Object { exports[`flushChunks() called as pure function babel: uses entries provided by opts.before/after 1`] = ` Object { "Css": [Function], + "CssChunks": [Function], "Js": [Function], "Styles": [Function], "css": Object { "toString": [Function], }, + "cssChunks": Object { + "toString": [Function], + }, + "cssChunksHash": Object { + "chunk1": "/static/0.css", + "chunk2": "/static/1.css", + "main": "/static/main.css", + }, "js": Object { "toString": [Function], }, @@ -99,11 +126,20 @@ Object { exports[`flushChunks() called as pure function webpack - chunkNames 1`] = ` Object { "Css": [Function], + "CssChunks": [Function], "Js": [Function], "Styles": [Function], "css": Object { "toString": [Function], }, + "cssChunks": Object { + "toString": [Function], + }, + "cssChunksHash": Object { + "chunk1": "/static/0.css", + "chunk2": "/static/1.css", + "main": "/static/main.css", + }, "js": Object { "toString": [Function], }, @@ -130,11 +166,20 @@ Object { exports[`flushChunks() called as pure function webpack: uses default entries when no named chunks provided via opts.before/after 1`] = ` Object { "Css": [Function], + "CssChunks": [Function], "Js": [Function], "Styles": [Function], "css": Object { "toString": [Function], }, + "cssChunks": Object { + "toString": [Function], + }, + "cssChunksHash": Object { + "chunk1": "/static/0.css", + "chunk2": "/static/1.css", + "main": "/static/main.css", + }, "js": Object { "toString": [Function], }, @@ -163,11 +208,20 @@ Object { exports[`flushChunks() called as pure function webpack: uses entries provided by opts.before/after 1`] = ` Object { "Css": [Function], + "CssChunks": [Function], "Js": [Function], "Styles": [Function], "css": Object { "toString": [Function], }, + "cssChunks": Object { + "toString": [Function], + }, + "cssChunksHash": Object { + "chunk1": "/static/0.css", + "chunk2": "/static/1.css", + "main": "/static/main.css", + }, "js": Object { "toString": [Function], }, diff --git a/src/createApiWithCss.js b/src/createApiWithCss.js index 277304c..ef0337f 100644 --- a/src/createApiWithCss.js +++ b/src/createApiWithCss.js @@ -6,6 +6,10 @@ type StatelessComponent = () => React.Element<*> type ObjectString = { toString: () => string } +export type CssChunksHash = { + [key: string]: string +} + export type Api = { Js: StatelessComponent, Styles: StatelessComponent, @@ -30,7 +34,8 @@ export default ( files: Array, filesOrderedForCss: Array, publicPath: string, - outputPath: ?string + outputPath: ?string, + cssChunksHash: CssChunksHash ): Api => { const regex = getJsFileRegex(files) const scripts = files.filter(file => isJs(regex, file)) @@ -101,7 +106,20 @@ export default ( // 5) for completeness provide the paths even though they were inputs: publicPath, - outputPath + outputPath, + + // 6) special goodness for dual-file import() + cssChunksHash, + CssChunks: () => ( + ` + } } return api diff --git a/src/flushChunks.js b/src/flushChunks.js index c117833..255b043 100644 --- a/src/flushChunks.js +++ b/src/flushChunks.js @@ -1,5 +1,5 @@ // @flow -import type { Api } from './createApiWithCss' +import type { Api, CssChunksHash } from './createApiWithCss' import createApiWithCss from './createApiWithCss' declare function __webpack_require__(id: string): any @@ -78,7 +78,8 @@ const flushChunks = (stats: Stats, isWebpack: boolean, opts: Options = {}) => { ...files // correct incrementing order already ], stats.publicPath, - opts.outputPath + opts.outputPath, + createCssHash(stats.assetsByChunkName, stats.publicPath) ) } @@ -199,6 +200,16 @@ const filesFromChunks = ( return [].concat(...chunkNames.filter(hasChunk).map(entryToFiles)) } +const createCssHash = ( + assetsByChunkName: FilesMap, + publicPath: string +): CssChunksHash => + Object.keys(assetsByChunkName).reduce((hash, name) => { + const file = assetsByChunkName[name].find(file => file.endsWith('.css')) + if (file) hash[name] = `${publicPath}${file}` + return hash + }, {}) + /** EXPORTS FOR TESTS */ export {