{"_id":"webpack-flush-chunks","_rev":"70-c9dd6e3f87e2bd9e35777df5b81322ea","name":"webpack-flush-chunks","description":"flush webpack chunks for SSR from React Loadable or similar packages","dist-tags":{"latest":"2.0.3","next":"3.0.0-alpha.4"},"versions":{"0.0.1":{"name":"webpack-flush-chunks","version":"0.0.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","commit":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js'","test":"jest","lint":"eslint src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.3.1","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.3.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"685c244edd253abfa16892d11ebbc7a07bc15f20","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.0.1","_shasum":"1c3763469abacee3f0ca926b77e4b27c2424763d","_from":".","_npmVersion":"4.1.2","_nodeVersion":"7.7.2","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"shasum":"1c3763469abacee3f0ca926b77e4b27c2424763d","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.0.1.tgz","integrity":"sha512-GhjyLWIcQh385nrtD10YNF8Tq4O6Q/72Pd0MtOG4O+mxESs853+ey0Hqdi6xz6VfBSZv6DIol59R5WeM8nXHfA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDkrICkxEFMJne/GQteG8PjSGDbK2I7P5o/rNN6KezvpgIgB0lL9vToF83UA70EE8apKQ0Q5eMGoWaAEIlK8EMN76A="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/webpack-flush-chunks-0.0.1.tgz_1493207581170_0.9640850028954446"},"directories":{}},"0.0.2":{"name":"webpack-flush-chunks","version":"0.0.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","commit":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js'","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"6d3b5ed4243e40a03b27c0f04587681c58e3859d","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.0.2","_shasum":"51433ac004d618e9c54da408e29bc146683dde5f","_from":".","_npmVersion":"4.2.0","_nodeVersion":"7.9.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"shasum":"51433ac004d618e9c54da408e29bc146683dde5f","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.0.2.tgz","integrity":"sha512-PFfYDNwW7FUVtldF+h7g9ZmtBf1aCFCTPL3GjDISWPM2M/QRZyH3GdQZUPf/357zw3yAVEbFc7eVDlW0d0oYHg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCRCyFm76I0Be67rpoKC1hSWfrboBd92zftsM5fLmvPxQIhAMAowO0xkzRCHuh89bbTO1Iu0NeALmkunpdCclpjM5Cq"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/webpack-flush-chunks-0.0.2.tgz_1493292010635_0.17833540914580226"},"directories":{}},"0.0.3":{"name":"webpack-flush-chunks","version":"0.0.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","commit":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js'","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"76f6b190e1d1de489db31cf14788f5ead94ce04d","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.0.3","_shasum":"a986c003932289686c581dc8c39149a4de489df4","_from":".","_npmVersion":"4.2.0","_nodeVersion":"7.9.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"shasum":"a986c003932289686c581dc8c39149a4de489df4","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.0.3.tgz","integrity":"sha512-ev173v1tKO2PPuSkzBQ7ey6vdFHL9I1V77LR3wI8CrKCGxVRYqPAHmtHlTMFfGAnIOACF3hrK0m+ITtnMSNq6w==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCcFmwJLu17MbC0C9O4wQDS/6SThOS1yhPO6jz15sP2rgIhALiX1G0AZP2eiJ9h6Si51jSDnG14VJxrTQmjSvb+ckdz"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/webpack-flush-chunks-0.0.3.tgz_1493303826750_0.5869391234591603"},"directories":{}},"0.1.0":{"name":"webpack-flush-chunks","version":"0.1.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","commit":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"dc98ca49e2ba2ea47c2dda276bbae8fee18dca8e","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.1.0","_shasum":"f7971823c6a806fcb73ae5430513af746411d708","_from":".","_npmVersion":"4.2.0","_nodeVersion":"7.9.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"shasum":"f7971823c6a806fcb73ae5430513af746411d708","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.1.0.tgz","integrity":"sha512-shlE3xe2uxYZkEvJAGdjJgjXYL6DcrBHhg9dRfeckiG3XDjv12dOvkKOV+RJw/MjsEAXmE4/YFSXLJzv1LbLhQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDC88rWEs6wS7NrIqiEpXxo/xYhPLcOgFB7PQf8A90REwIhAMGgc3I+vwRieY9X15AlF4dD6mBGvmu67BCzm8UEUtoj"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/webpack-flush-chunks-0.1.0.tgz_1493465083205_0.08167345519177616"},"directories":{}},"0.1.1":{"name":"webpack-flush-chunks","version":"0.1.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","commit":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"e590571b88b35b4f2b106a593bbcbe2c4660a62e","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.1.1","_shasum":"254977503737e40fed702b59fe30cc3ebaac4df1","_from":".","_npmVersion":"4.2.0","_nodeVersion":"7.10.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"shasum":"254977503737e40fed702b59fe30cc3ebaac4df1","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.1.1.tgz","integrity":"sha512-Hrtev6L5JDhmEbMvU0Sg9TZdxEH+Dj+slaS0x+YtMtOvc/ikoPd0KE4YXxws0otLISOtnSO1OnwvGZZSW6dPUA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDoaW7Tt2SfFLa2dW90uMyqxBJBtvRf/syt7IuuZgwdHAIhAOZhH4hMRMf1JC6GbhcmE4tlF7t4+bWEcUMNGf6e4jlC"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/webpack-flush-chunks-0.1.1.tgz_1494148376886_0.7678683365229517"},"directories":{}},"0.2.0":{"name":"webpack-flush-chunks","version":"0.2.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"src/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"4c7d1caf1fc4bd4cb08bb153c4e14aece8feb2cf","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.2.0","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-qYewXEz4TTBcLoxSibwCBIY/4fd3j9rySRql8Vj2hUouC3u5XBN9yJaDC2k9GfG4OvYSn4roy0A31Nv0wu26hA==","shasum":"f25182741bb12148b1cb41d0bdf5b60d2fb9beac","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.2.0.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBeO9FVsrVOSK/JspaVVi72WIIGpG4P0ElYv6pQ48HOYAiEAqg8ZgwFgFd6fkyiJlu/romWaQtSioy0V2wAUegXgeww="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-0.2.0.tgz_1496807927651_0.02521325764246285"},"directories":{}},"0.2.1":{"name":"webpack-flush-chunks","version":"0.2.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"3a5f3c2c112ac40c4c40d0fc81c40e81e672816a","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.2.1","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-XKUOWdxZGK9pB3Zx/mI6efAqUKiFgtmG/IXmjzVkac4FQrsKqTdZITLHR55UhZVsu6djgpWQkOIiiidUxYSL+w==","shasum":"af2dd6a24447e799aaad4d8361858e2a944f02bd","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.2.1.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBPUoJ+Yb4v0ayUqjwyrB9SkAeBqnOZUtybSxPCH2id3AiAh//bNNk2qgP5CAqsfsujoeRHy2zwFnX+wjlPkQPQPzQ=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-0.2.1.tgz_1496828013978_0.27710506203584373"},"directories":{}},"0.2.2":{"name":"webpack-flush-chunks","version":"0.2.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"d3df101245aad8e8996eba6e2b73c591f7ecc347","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@0.2.2","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-D2S8C1gdmEBxPk9N5lo7b6AOXK25H3K5MfNPPC/zEoF/4U2r8gnYPmKRXPmKVUzoVvnuivJdjC2MzwRtiPzwuA==","shasum":"267abcbc94934006570c1e6cc0fdbbbc331c0a2e","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-0.2.2.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDv1CYiNKBZTJyfVowNU+gsR47L0jKIJcE62ELTsVjzAAiBJAMWO5k0z3i2D/wywdu+nWLIy9Y2PSiyADzpSOX1iNQ=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-0.2.2.tgz_1496870545779_0.6936063608154655"},"directories":{}},"1.0.0":{"name":"webpack-flush-chunks","version":"1.0.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"7ff389d599f22a4e709256a0f70d452a2a66d6a6","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.0","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-JltGew+l/2fjQkk3idCTH42PXpTWbJHsaw6CzuMxcasKlZBIIxI3ltrvGMBBdRAKjIfNMvO9Njy1w7/V3pHGow==","shasum":"a030af4b4d5ad20aada691e21fe6fc3c84987144","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.0.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCn0EuNw1c0VxbPozqJ3v8qsyA50yePRHZzsWoz/5mEEgIgRkYkQBaaQE1jw5AybVy0bG8klSv7zaWPA9kAUaDklyw="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.0.tgz_1496909617656_0.64635493257083"},"directories":{}},"1.0.1":{"name":"webpack-flush-chunks","version":"1.0.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"537ead61ba6a7fdf1ee3f155155cf33ed89a2f5a","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.1","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-9fejPoZ9J2PuwBdKf4hFNFjE6EibEqhDSyr8XLOu48lvuPSzCpE/FhRW+MY2KJnGs4HWJ4TCUzLo3LyLFw/U/g==","shasum":"02a1c47e8d46ff71b5147c2a4eb9e11fd8a48f2b","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.1.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGXLtmrY2y2YYjLDPnQQztrNIiuE06Dharg31FSHV8SfAiBIC+1nKvdiP/L1u453L7veBMT8Onv+zx+ARLuRNN+enQ=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.1.tgz_1496912526064_0.2505278345197439"},"directories":{}},"1.0.2":{"name":"webpack-flush-chunks","version":"1.0.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"f63e109ba60800630e5022fa0f6eb43ade567df3","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.2","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-6RbU2tWCALoHUFklCQ3uG0Jb0YfX58sZASFjP+iscHVll7ZENoSdCvhOIsTi8qPwqFrGHS9CfutVvUlgEsnSQg==","shasum":"e48fdcd83d7894816ff902ac2629d6ebf2f73ca1","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.2.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEfi0wRXxMJFBqyulFPQaydulpQlpmRQzbWR0rKMk8WUAiAbgYcVnSboXHU91Caiii9LS3b/fNeVwsR8Llrtpt8MsQ=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.2.tgz_1496913949761_0.4862163623329252"},"directories":{}},"1.0.3":{"name":"webpack-flush-chunks","version":"1.0.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"precommit":"lint-staged --verbose && npm test","cm":"git-cz","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"yarn build","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","build":"babel src -d dist"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.10.3","flow-bin":"^0.44.2","husky":"^0.13.2","jest":"^19.0.2","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"ccc931bd0c242b2037ad13a8d2a77f6b518e0c11","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.3","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-cufwgtT8Bbng/g8AZU9kGwjLYuy3JsvZE73aaw9qA1LAkeknD+1LrGt0DVAm2xDLZLQ6RiOZKJrjfN5YYIYAMA==","shasum":"8b806e1911c0fded3dc7e79e0d92d2f82af8c492","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.3.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGFzMdc2ubnq4hK6ecfK0pNdfNj8fmz4/ki3BShDIA1yAiA4mU5kbcj67tKnmPh+7I1DH25w9yE35XoRXDsWvBki6w=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.3.tgz_1496914903989_0.7290357002057135"},"directories":{}},"1.0.4":{"name":"webpack-flush-chunks","version":"1.0.4","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"94dd802b7d57322793c8f1d229ccf159df2cca20","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.4","_npmVersion":"5.0.0","_nodeVersion":"8.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-MjpvdnMATjSCCEsfpSjc6FWMWlkhs2e1ZBaYd7qPH99nRGkHrCgxJPjOEwffnxBLTCpyWQAHbxd0BfmaDSNRtQ==","shasum":"2986ef488f906b7876b3d296b9d9b7ab8dd8024c","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.4.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGyjcIZ/iPYlIQGgGTzoy5kvs4msVioA0JkuAsbzHzAwAiEAoGdh8PO4yqiMe3NVnTAxwJ8hEaoJ6Ni5WWIZvGcCCwY="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.4.tgz_1496919356168_0.3658407083712518"},"directories":{}},"1.0.5":{"name":"webpack-flush-chunks","version":"1.0.5","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"c1780abf8f4f3eb5c0f3e4dce9f326a3a72a0260","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.5","_npmVersion":"5.0.3","_nodeVersion":"8.1.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-MBKiOeBhJloxXolUbMDxweFlNbzm28dYeYxU3Yrj+ZjUj6C+9w0WDLunn4JDnCYfdIaZctbpwustbWnwrUaKoA==","shasum":"b3b51960e4ad86bd3e6b54c4b9e8c6a7efb4aca0","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.5.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAvdg84tnnPnEj7q75uwrripc3Q2osEq4rNIcBhTs9TaAiEA6QkmTdWECB4jKIP2ZGtovpFPdCpYmAC2YgRm0H/y/1U="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.5.tgz_1496923228807_0.17947972007095814"},"directories":{}},"1.0.6":{"name":"webpack-flush-chunks","version":"1.0.6","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"13e79e6abbac9e388233483e8a90ef6bbe000fbd","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.6","_npmVersion":"5.0.3","_nodeVersion":"8.1.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-iUz/hi6UqIuCUrsdPBlVkkOnJDibJVzfoNwE7aKHJTlwFe9j+Wf2IBP4m8l3WSrAyBcrVJB21PMfEjiAL7ZdWw==","shasum":"bcdbc7fd62f1a12089c6c14ea59c195100be1e8b","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.6.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHJPDLstreojZdv4H4Riyt14rKUyAN5KYgxCrD3/Tn92AiEA6vrF45AXAkdocxr7AqYT1EPstNC8zI0rxpKMMjvdZgc="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.6.tgz_1496923359543_0.06488035316579044"},"directories":{}},"1.0.7":{"name":"webpack-flush-chunks","version":"1.0.7","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"6ecc46fc332f0e821c7ddc1166dbf07b45fe922f","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.7","_npmVersion":"5.0.3","_nodeVersion":"8.1.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-PfTHF1gFdsHVGVJtsF0n7k4YrnGBCgVHxTP68A3Ci3ZJScdOrxWjLo6S3U21f8MMzmUzfhi4eKEofEv+tUe/wA==","shasum":"40f53d3223a7dbe87604ff76235587f2c640fbb3","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.7.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC158udRhXdtT0T9aXJC7z2nGvYD3/il/I05je3FZlvBAIgIa26I/f4kS7SfEGfO8xXbWGD8FgVMNzf7rhgSOBZRFA="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.7.tgz_1496930190127_0.2917696291115135"},"directories":{}},"1.0.8":{"name":"webpack-flush-chunks","version":"1.0.8","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"25bde69cfab759b1ecec69d5b31d0ce346b92513","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.8","_npmVersion":"5.0.3","_nodeVersion":"8.1.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-maycdhy/X3FDMb7+4CV3TZFDcoxTUbsRNlN3x/IfkXG4D5a8vMZmHLSScDIj7Y5vjBrFzd10K9ovwynbd3IU/A==","shasum":"54797bef9934d6f0ec14d5bc12cb729e7868cb2e","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.8.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICA7S2LChsHU2tbk6k6j1iV3ckLYykK/+OM8rHlh8z/rAiAIgOLbeaPLXr8+n1yXPvigr6XZuW9AGwSO0cr6jtaWZA=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.8.tgz_1496930305866_0.5725381795782596"},"directories":{}},"1.0.9":{"name":"webpack-flush-chunks","version":"1.0.9","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"8a2dce08c2fb7d41daa3a3ec487103b00a32b4fd","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.9","_npmVersion":"5.0.3","_nodeVersion":"8.1.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-fkKJ9Ejo7YLdvXt6AZEaXHc7AfJv0NGTApf9E+u57NM8a8wfMKcq3iPzf1xT8gvwXkaT+ZK+7AYG4cu8ukIMxA==","shasum":"32e5baa25c46f5a935b5a0aba7a0fde8f2abbdc5","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.9.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHmZ8Kq2cBj7UGkGWHURve2Gh4HzDH4y/6HO+J1k/bbtAiAtKyFz/ufDCrueZRE6oQ5fQ9JbAbXCTPdBcivjFfNCyg=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.9.tgz_1496937603441_0.6724211408291012"},"directories":{}},"1.0.10":{"name":"webpack-flush-chunks","version":"1.0.10","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"2befa77c18492dd10a14201a34d795e99fbf3dfc","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.0.10","_npmVersion":"5.0.3","_nodeVersion":"8.1.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-Bro9+qj+2QDAA+DGJ/4mbiktmZmRuASGWkXcA0iLzQ5gacKYPzfhVmAEdmOgk9MK4akTQyzuWKdMzRALpFCUlQ==","shasum":"f5a89aa5b1c023347b48619966b787298246f174","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.0.10.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGjjXfeyNL6RXPaFzuQ4kdjyqE4dhPHq5IFFA5tXuDZ0AiEAxK/ACpxuAjybm2MlDTRphGswMznDYHon4Ur89+r8fLU="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.0.10.tgz_1497145704123_0.7272496728692204"},"directories":{}},"1.1.0":{"name":"webpack-flush-chunks","version":"1.1.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"2c86d120781d5034758ba58fcfa69b5fc6267742","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.0","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-JH+8ddTJ1lTDE6Fq+An1/AUJ7Tk+EVBmJt8SAJUi3IPRE+5vssFnOEgwkW5r7xqEbZThA8GHK48HmxxVlhw8WA==","shasum":"d17ff87e69cff9d15d47931a90d8e73ce345c57f","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.0.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDXP+sIihu2LQGEq/7p7wIA3b5VIrGDUdnYqo6dxXjENwIhAPE2DRzDLfJM4KBaEAjZ/5U5XKwkfmNnfaxM86VMlEpj"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.0.tgz_1499204768559_0.3043926563113928"},"directories":{}},"1.1.1":{"name":"webpack-flush-chunks","version":"1.1.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"c56a51c4eb88ab20a620612222ecc7b8c8b3afcb","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.1","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-LKcpeQdBzQbFKUHhp66EGoHTT36CKc3Hnxr8z+N18SYpowKs8/nwDxBF7GMUtl5V/mpugZPp7AO34pwlh3d9mw==","shasum":"b49c4084a555e011e50ce1950da363ae79b71785","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.1.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD+6Ydzso5LbSMntR8fnRN1kLzqEpiux3UdgV6sIizOkwIhANMjkRtU7sm9rfkYr5bs0t6jyl+b84VW2Jw/XZnVazw+"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.1.tgz_1499205490620_0.29172701435163617"},"directories":{}},"1.1.2":{"name":"webpack-flush-chunks","version":"1.1.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"2a0a3118288219948212d91f8997a4b130a37cf7","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.2","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-PYYgfvH2fhS1qqUVYOIYL1ZA9jSKr01umR1l2UsWzY/EsU53uRZ/84O+W9V2DRYovhznr7fzcdsKnXwbfiadvg==","shasum":"0452b26402112ace91ad7d089a0d23450e70d78f","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.2.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCkeBSsiZgaPdQat0RwOQlSudbCg8lWQ0jJvQBlhrtQRAIgTBt9It8xTpKODDYRMq6QUMaiRcKUMPlMtKIb4XjettE="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.2.tgz_1499205765168_0.5670887660235167"},"directories":{}},"1.1.3":{"name":"webpack-flush-chunks","version":"1.1.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"177e65c7b34972e53f4dbfdfc4374aa5a9fed4be","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.3","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-DoHdKiV7tkMnR9B+LuFLQKaY6wncwEMJeatLiPvLxcNSvZeS+iKWFna51Q11ZV5ygXRJs40nFUjs2gHIpsqnhA==","shasum":"a2a5b4253b47bdb70eabb929ad9a86f2089946f3","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.3.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD/67SHADBTPY/CoOa0B4UrfLcjqO2l1UNvdyKyplb+RwIhALy+RoMT2LaTSnteCPwzTa600kOBBhH45yPbrg+tHW3H"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.3.tgz_1499434955862_0.8030162274371833"},"directories":{}},"1.1.4":{"name":"webpack-flush-chunks","version":"1.1.4","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"3566590a2eecd640e51a84f607f669021f43aa92","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.4","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-P+9ZOvHRbRjzRnJhebKZCt4hRYO3QYYLJjP04nUHFibGtwSrTOEHbGVdKtivVhZLtIRU7GKZufUCMinKv8bttA==","shasum":"120de6c1cb781267ae179feb9bc3d04fbdc47145","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.4.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDFsPYn1EQhf3U1IJis2ssHfHr/1UNTyw3sQKQE8Too9AIgehHTob9aM2ST7dQSv9IxZqWaHbIVFAthFimLz8V+IwY="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.4.tgz_1499434994365_0.5128843472339213"},"directories":{}},"1.1.5":{"name":"webpack-flush-chunks","version":"1.1.5","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"e88abc8a067b5588663bb9adc43bce7e8913c00f","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.5","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-ZTV/KVgqajZZ81iSgLfifr4idB6bMOrCxYjearIz3Y55RZtchEpiLHhWFIIUJregRnlTjvwP8UVAvL2Z47wK9A==","shasum":"d64a4affdb8125bff16583733f0965fc39ed9d21","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.5.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHMz9zuuWKYdoajAqIRTizPwNvot+EDNZ9chGhp80rxDAiEA3qb66c0kSh3sE9lnvFqzh7WURwYyKEEhm5h91MvG1vo="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.5.tgz_1499435173247_0.33032767614349723"},"directories":{}},"1.1.6":{"name":"webpack-flush-chunks","version":"1.1.6","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"166687cfab134a8078965773a7f24dfa45817baa","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.6","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-PxMx6CQmVKxlg7whKXMMQuezGMOCl91lcrC/DKGyQUpetDNZDpO6nnXd4rThjuBIfmjukSo3kZVzr9yyDtL22A==","shasum":"b3925c5048a08523fd301ebd4bf6c788fe875232","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.6.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEuVIAD4HjLD5e7ZYMxPsKL4RCnD4Bfz2yJoRU804VqLAiA52vYuh99QquFdgEnySdskJwYTlyUQtwSTU5HKYaBVQg=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.6.tgz_1499435297310_0.9596871701069176"},"directories":{}},"1.1.7":{"name":"webpack-flush-chunks","version":"1.1.7","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"0b52fe7adf88e4a15a5beb8a9355c30c4fcaca50","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.7","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-URGbYC8sgfUSFnhY849mdlnT22ugn5PCVT/+S4l1s4HFALveuKFyXgCKuvUTsk9se2wA6L5euHKNwS86Y2CdYw==","shasum":"0adf2b7e66e82c978fb23579916a62083a7d7f87","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.7.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIACBLsenqveH/FbXZH1/7l2K8s3JvCDNSYdIQI3UB1X4AiBj7pnW56TQgrXh8Wtf7E6USPjX+il6k7Rt+cDxBGNM+Q=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.7.tgz_1499435447307_0.37734191538766026"},"directories":{}},"1.1.8":{"name":"webpack-flush-chunks","version":"1.1.8","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"eeed5b61993009d149c844c2798744fcf63559fa","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.8","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-hGD4nt1czlfxHFQPEKgKdcQEGVbwiL+UALs2QJ+FPWeNbZi3dZbTYZLlOx/S/ek920f9Je0wAv8Tl01STgCx0g==","shasum":"13456ccf36cf378e11cd94805fb6e68bd01e2d0e","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.8.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCXR+sfkiC0VxPdCeSHy2Gx0UqMooUHkn6XNkjS3g09xgIhAN7NADBHknisafl6/10Sjf0AkEcLdadhyzCZnM4eNGrf"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.8.tgz_1499435506337_0.3599163144826889"},"directories":{}},"1.1.9":{"name":"webpack-flush-chunks","version":"1.1.9","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"562a9fde5fb8328519bd15f5c822c72ed6f96be0","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.9","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-iz3nfrJ4PA3XZhAQmxpSjw0Z1u4XRhTzIB28kJdzEcYy2cjg7UZHD1j7VlkB5kvKouttbdf2r0YpfFjoxFIbOw==","shasum":"ddb5d1b98891dd8fe0cc0d9aa82447b6d7ef724e","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.9.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCR2vD0qUn2L6yReUh76dO3pIi++vCjhOMdr7pvuX3RggIhAK//mhY2MZE0JiQjQovFGTpWA0Jukzez2nuPFnkS/SPj"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.9.tgz_1499435713232_0.10755559150129557"},"directories":{}},"1.1.10":{"name":"webpack-flush-chunks","version":"1.1.10","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"6ccbee4101177b007b9f7e910df338f398f91b6d","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.10","_npmVersion":"5.0.3","_nodeVersion":"8.1.3","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-GDf2GOtHCXedg2MKCTwR3yVkzDDJ2WpJAbaScwwwGASyR9JR9I4p7RpOLoY/CKfi6qqejIn0e/496w4QjIAq5w==","shasum":"1cffb28a0e36187b046c4ca3160bac0d3ad1d2bc","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.10.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEE1CAmkwu6ynOLE7Q2IOpLwNSpHDmyD/y0JalvGqoAOAiBfdg+HBaDm5v1mOZTgaOvNWJnPHe/ST4STo8LqEmJOCw=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.10.tgz_1499435784446_0.1366840056143701"},"directories":{}},"1.1.11":{"name":"webpack-flush-chunks","version":"1.1.11","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"56e85b1f406a8aa0ae83c139fc0f82be26dc0a19","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.11","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-itizSyfhSIZdn3PKu7b8vsGZ30akIRsljVJJraBl0aQDBNg8sfdvitxFRWeDeubH9g+/lauFeDafL52xboRhfg==","shasum":"7af95f279ae4a06d973ff9e75645b3081ecb83a3","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.11.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDL7tM/NKzbXM+JirjXqHZCcuMg+sDFlZGIg86CX/hWCQIhANyORczICTb9lJ+B3ixDwZ4Zm+4G+CtWwq++f6tv1gQx"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.11.tgz_1501132937490_0.08769319020211697"},"directories":{}},"1.1.12":{"name":"webpack-flush-chunks","version":"1.1.12","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"426d62478b734c3c827da31bf216091746830fb7","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.12","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-akayLylM0nuHwk5t5YSmZ62+xcYbQOUQcjjsCFaCfEhrIoOS1H/2JAuUoSIvW8LW3hbuUMhu37nS1qgqPH6Tzg==","shasum":"8281df3edd6458fb4fbbf4f9028982520a0015fd","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.12.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCs+XHCnFlbNpUbSHkQowG2ldeZN2ItPaAa2a9tO56fQAIgOgS4Ul5LYUkdfnnOyKF9DDW23o96Y2QpFjOu2qYysoQ="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.12.tgz_1501162948605_0.5778814423829317"},"directories":{}},"1.1.13":{"name":"webpack-flush-chunks","version":"1.1.13","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"acf079a4ad6ae86e92fd39f98e07fa684a19e630","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.13","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-HFy7QLT5vsHy2rW8KHFN8B/e9bqcjWCJLpiy9fshCXFZlzURhqYQy66/ZKOmNuvLHulff6najGJiXNkFpAJqqA==","shasum":"5d5edf7aa6e3cc452b5b87094a735148151b8421","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.13.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDoRd1KBfxiDLGHGdZPByaSaTPAjqJpmhyCvxbsf5oLjQIhAIQPVghLwaBNqdU0v3rHXHKU7uzXqworAs01EqPddmNH"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.13.tgz_1501166219605_0.48313497798517346"},"directories":{}},"1.1.14":{"name":"webpack-flush-chunks","version":"1.1.14","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.4.0"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"d78a60cab23e65eef4bcf0db3492567c1b2d5cda","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.14","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-+Ah58ggu+hjf/olnmXVBgw4afJj62Sg9vC60DWHhjQYa2i55ekpyKJ+Q3uyKY8i+N959k03IhFh2CaZB0wiOgw==","shasum":"9466eb1a74ed764b68032ad2b0585dd7db962a99","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.14.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD8Agl26sA7HavFJUkBMnjRSyzHw474wQcNNHsuXRqPiwIgQb0QbcFR5Vg9SW4wOmGqoXkQRXnA5bzM8zNN8qMU9x0="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.14.tgz_1501166229864_0.35693639842793345"},"directories":{}},"1.1.15":{"name":"webpack-flush-chunks","version":"1.1.15","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"99e52f0efaca4c2bd98930af737399e24e1e8df7","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.15","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-uZAw+gLI8IfEPQwpdUTRNrgIUdj3f+nR5DrV8Re77lNdacUzHyZtYkKGvbXaOCqimJPbjALSV+S1xw+A1HHFoQ==","shasum":"15ea73f48bca6d65f3f60c160e2be8f54ef318f5","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.15.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDpevhoyDdjkQ4UmyTDeusNu49TXeymyjrGW8n2nA2UOAiEA71msfQN9eR75LS0sol0SXoxULuwdTQrE46bfiTg5cho="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.15.tgz_1501271877632_0.7048889112193137"},"directories":{}},"1.1.16":{"name":"webpack-flush-chunks","version":"1.1.16","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"05af8d4c043ea52e698d87042fe5081df76fae9c","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.16","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-OBL9nmEeGSb5qCXF0t7mVrvpGug1988tEMzk0OKjKPXToB4xG7FewgLksVrEYLx4rdrk/PciGwhs5BqCKC8Mkg==","shasum":"017cb7c8387710ad13d792e73d1e3faa9a64b23e","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.16.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCIHfG/aZggTYKhoeMbjHlmliCZnp1Rwsv95sHbYbgzGAIgO3JtpjP5yrjq69dmUAqSDFLSI1n+TA0WSIfYYaDzn2s="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.16.tgz_1501273912837_0.08155734138563275"},"directories":{}},"1.1.17":{"name":"webpack-flush-chunks","version":"1.1.17","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"4c37ff977e78f2c53d2077788dca4b2b5a552d90","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.17","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-Is0YluKcI/JzQGs7x942VGgaQ5qHeOeXiYopYCziwpmwuJz0x3Z1GOqK+/0MAuUNRG+emdN3qpvhnX+aHgPQ9g==","shasum":"f49f84a26c0e59739e9b90bf24186cd30b12cddc","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.17.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC2LcLdRs+bHhggokvkCU66w98aL+v5H0HhhLynC3fAnAIgJWBlENnoM07I9IwvtI5+TnCSuT6BuRZQSKwY/Yfy1es="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.17.tgz_1501497691141_0.033962077694013715"},"directories":{}},"1.1.18":{"name":"webpack-flush-chunks","version":"1.1.18","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"120086975cff93334a61c43d1bd7d5f8edd168ce","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.18","_npmVersion":"5.3.0","_nodeVersion":"8.2.1","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-sj1gj6XsqcQgfeM5rTo7icp8SNx6KuMmcltF9oFJykBfoRlk+srm9sqcr29/C5/sYQ1J8eZIdsyiGz9X/8+iKw==","shasum":"30b2ea8dbc932080bbe37ce859becc1bb8079a9a","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.18.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD9JtCeHmKCSC0gtJYdxOyBzfesHQx6r5w2llH6oWNpKQIhAPqrpiKnfqVpduukoLefAsMAeu0DcStgIA3NHFe/F2Ew"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.18.tgz_1501855390790_0.2908874589484185"},"directories":{}},"1.1.19":{"name":"webpack-flush-chunks","version":"1.1.19","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"7c04566f241e8256281fc67513a1fc8c446cd350","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.19","_npmVersion":"5.3.0","_nodeVersion":"8.3.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-B7Fe28mModyiENsMWC+ZxD7aG7o/RX/W2xWHbnVWT7kLZduPp8tp59VhiKvUQgm/G5cHLvUf/MuEKA1Dkto83Q==","shasum":"b306f83ff454ba5be3d10f788994d9cf8bd0698f","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.19.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDP+LmUyD9MGVCsojITjDn1W3x1AwZcOxHvSPM2fk590gIhAK0bUcXwrjZtv3Xc54VYDajZ4iGPII2aBp96azlmxGSe"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.19.tgz_1502531693684_0.5338101491797715"},"directories":{}},"1.1.20":{"name":"webpack-flush-chunks","version":"1.1.20","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"a7df581e3e7db8980f14699e4ca3284d3c80be8f","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.20","_npmVersion":"5.3.0","_nodeVersion":"8.3.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-Afn8h8gMYsukyBlG16CkVYfct+uU1jJZMTk28Hc/7dWtVDnv39Ju0brugWUi3l+tEfVsw2+PSpdIpayVywmESQ==","shasum":"bd324bc0b0a273a044c3c4ff97770582fbae0547","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.20.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEMCHxvguUPm2PvZnh4E6MZbZcTKW9n/dGnodFOktLW+JjQCIGzSVG6VE1Mp7cv+XrpRd5RGKRZIOlgxlDlthn8hPkIZ"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.20.tgz_1502531874795_0.9862680730875582"},"directories":{}},"1.1.21":{"name":"webpack-flush-chunks","version":"1.1.21","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"a195fe85baa640d54f87a24cf049f7c699bc123d","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.21","_npmVersion":"5.3.0","_nodeVersion":"8.3.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-DLp+4W+N1zEr+EdP0YMU/Cktzj0FVlGYSAjL1SuOVkqNe5hx1Vg+iu9r904qa1UQ9o+dJvEos+TPmHw7ysVmhg==","shasum":"d2dcb4db5de14baee1b10485cfd07dbdd67ce8b2","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.21.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC1tUW3Eopj8O5WvnJl/QSrS/caPWdATw9VfgiJbZVKqwIgLbP6FEAJt0fXXD0C5gth54QrJ97PGDe3E2KUnU4q0uE="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.21.tgz_1502696949647_0.6327187742572278"},"directories":{}},"1.1.22":{"name":"webpack-flush-chunks","version":"1.1.22","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"c92f864dff8491ec8c53989de730ceeebc02f79f","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.22","_npmVersion":"5.3.0","_nodeVersion":"8.3.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-lDmZQjGKsxQIUGUK3f3K5xVomASqSCie4qsJc9TSfkBJ5B8bLvF834HlIudEOyZQnkA7LcDjS4O4ejEvyF6MLw==","shasum":"638d7aae8f6dbc29412c94bd7f5f46897d87e04a","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.22.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE7DwS0Mk9kFJKSPE51HJXtbcueXZTW0I0Ll/5EACP/SAiEA7+1dv5pkc1EkBsAkLjsB7IWdslU+zHJZivLefz3CbHc="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.22.tgz_1502729522575_0.40316887060180306"},"directories":{}},"1.1.23":{"name":"webpack-flush-chunks","version":"1.1.23","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"524654a2b51940793effecb3d07beaacc151d89c","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.1.23","_npmVersion":"5.3.0","_nodeVersion":"8.4.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-5ZWl4qCc4dBzNhz55UCE94G49s4qLXEA0cTijBUGx37ztwXKxHv5AIKAOCR8EfRq0JIkLUEGGhnIwm4F2vA2lA==","shasum":"130bd3f9d33552e2d7290862ef159978c6b98a1e","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.1.23.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD++Dj2INifVwLLA1UitDrL5z0I3LJc9ac2NmQ1gQljggIgMRBX9l9+Wcpp/Jvs0n3DeqjpikCRMAWDBkiNhfShlq8="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.1.23.tgz_1503066635209_0.24696886818856"},"directories":{}},"1.2.0":{"name":"webpack-flush-chunks","version":"1.2.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"dede650fce1b581ba31d6e158d37cf8fb8d35c68","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.2.0","_npmVersion":"5.4.2","_nodeVersion":"8.7.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-JfKIQhl1SBtrfeaTVVKqjiUkwNXZ/YfygPmr5kYco6TklHVxlVRfaUOR5zPoaIzMANWAjjnWAoRaQs1OOlVPQw==","shasum":"206b02c1e8990786df2cb97d32fe7c8e1745c1e3","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.2.0.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCpUeDq5mHea1AFjG7d9hLv/zdf1O52ISyy9qdlDWKU1QIhAKvwvpIPTLLRzKyhiCeITYF2o7+PUNW7EBAxJeIsu8E3"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.2.0.tgz_1507771084632_0.5645479310769588"},"directories":{}},"1.2.1":{"name":"webpack-flush-chunks","version":"1.2.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"f05982ee4c1cbb68cdfb5f64e3954d1edcada591","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.2.1","_npmVersion":"5.5.1","_nodeVersion":"9.0.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-iUxEqd1Pb8S15udPC+CDQD+CEYnPimhWM8YqQgSAU0rPFgIaQwyhzxkcj1Xp3CLEH9sLDhOgkc3hTcimmyZ72A==","shasum":"ac5fd020c6452c8b867ebf2204903607323e3416","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.2.1.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBW0sC6vZCfAN4CZxwFyVMopAVsiIi5CbSRRIr2BprvmAiEAxOwE0gsKbwzVLlN4ZJ7bBHX1o0u3A0NCl6rBx5qNvyA="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.2.1.tgz_1509531296421_0.9551476407796144"},"directories":{}},"1.2.2":{"name":"webpack-flush-chunks","version":"1.2.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"24720c0f26a849d6125d37c10b627eca88432300","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.2.2","_npmVersion":"5.5.1","_nodeVersion":"9.2.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-gP6+cAG1aGOzsS40OcWeV9dncSvpFyR/Wib7adP9Mxrn5RKBNvz0oNi7WHt2PILzG3kD+LRzEriXIA7Xx9pGYg==","shasum":"8bcce878a68da1edaaca4100ba9e13e356991f34","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.2.2.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCnymqYDPCoMTvYvGblM0TKMIJI2ZMyVpbokcsFLCoCxAIhANr2wKnpaBkaf8zTLXfkyQR+PjhIxabH35yVcrrTSkHx"}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.2.2.tgz_1511201200943_0.14044919004663825"},"directories":{}},"1.2.3":{"name":"webpack-flush-chunks","version":"1.2.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"0db55a68fff623874e73ec7263fd472a1396be29","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.2.3","_npmVersion":"5.5.1","_nodeVersion":"9.3.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-tF8GM6KXyLMM11iItNg51tSqFDrnUXbZs9gRNlmUnUpnQUuBjbXJYN3YzSD+hjQMEYWKa1xPxoAbsCoblC8Scw==","shasum":"fcc6cbb39f8b7ff6544d535787b48530e2bbeafb","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.2.3.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAFjW3a9vKSmXJKulyBDH6Syqw9+8RQ1bp8hcIaRr+4tAiBrOqWAvpBIyCk1tJqZkEuTUulLBnkI6NKiTvwKcc1Hdg=="}]},"maintainers":[{"name":"faceyspacey","email":"james@faceyspacey.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks-1.2.3.tgz_1513766647548_0.06770437071099877"},"directories":{}},"1.3.0-beta.0":{"name":"webpack-flush-chunks","version":"1.3.0-beta.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles, cssHash } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. It uses the `cssHash` string to asynchronously request CSS assets as part of a \"dual import\" when calling `import()`. \n\n\n\n*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n\n  <!-- stylsheets that will be requested when import() is called -->\n  <script>\n    window.__CSS_CHUNKS__ = {\n      Foo: '/static/Foo.css',\n      Bar: '/static/Bar.css'\n    }\n  </script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles, cssHash } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to \nprovide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \nSimilar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: ExtractCssChunks.extract({\n        use: {\n          loader: 'css-loader',\n          options: {\n            modules: true,\n            localIdentName: '[name]__[local]--[hash:base64:5]'\n          }\n        }\n      })\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks,                     \n  new webpack.optimize.CommonsChunkPlugin({\n    names: ['bootstrap'],                   // notice there is no \"bootstrap\" named entry\n    filename: '[name].js',\n    minChunks: Infinity\n  })\n  ...\n```\n\n- The `CommonsChunkPlugin` with a `\"bootstrap\"` entry ***which does NOT in fact exist (notice there is no `entry` for it)*** insures that a separate chunk is created just for webpack bootstrap code. \nThis moves the webpack bootstrap code out of your `main` entry chunk so that it can also run before your dynamic\nchunks. \n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks, not `main`, `vendor`, etc. \n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"88dbc9795da21f2f031887c9fe3b41f7d5ed7b11","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@1.3.0-beta.0","_npmVersion":"5.8.0","_nodeVersion":"8.9.4","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-uMIlxWkcdQ5MD4F2f4HOlMOsMSFPtFkpb4rSKRxa9H//DDAnPy/qEMJyjrELbdh5ymXksux53d7/03F5ONCO2A==","shasum":"af6f97233343b34274ae001afdd4fb0e5760592f","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-1.3.0-beta.0.tgz","fileCount":14,"unpackedSize":252690,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbHdfTCRA9TVsSAnZWagAABvkP/0/KsJdzK2amJ0p2b8ce\nBHo25/4UXR9aTgqJRn+bvXktcXIwzbtegN+V06KWxNhFmhARXaOGhsS6lH8S\newjMqrzGxsRfjV7KOGpaK5GfR7FfzpKaGBRf/aayUVpwqzoGi7YgNDJuDOwg\nzo7PDekHa9n/EHU055Iwyw9Py/od6LsHFDozT+kDxH742lWCFZji84nr6rCz\nJfNE9xh1zcGI2arvZTzMkzPtiLmViz/rTA2GKwIn5PNq1K+mie9uPhUle5xP\nZxo8xMMrtdeL/DLqDXI3qB1oiPtWYMSvBY6mdIcs717Xg6mQ258wHDxQkrc2\nyGCcvLuFhfx/v0N3bk6fMAgr8xIvkPesNiMROMxKqs2xhc3oTyJWZwwzSotN\n8Uj2oW3N7fBMyhTkHRwmQiKJzYIhiAd/G9wpHvieNUaW5jT92kC3yp78SRSd\naeAWth0+OU27bDD+Auz3btqAAfWguF8gC2ImjpgMYnCf4ViemeuBGXucH+Cs\njIV/mNXPScLZvq/FFtW36zv5Z1cusun006+638UJJZA6WmoLNvVPGfkvHSLl\nuPSJhH7JKQlCh7qnOsWNH16jVzj+6fu5YKJA6tVXUYq99kemmep0t+I7gzC8\n+l5e8eV1SWaL47xN2mxRIXLAv3dpiiGwmtW74qeNNDKTmUyxNe1BP93JQ1sK\nUU72\r\n=mFGl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFg63wGzdQX6uim1zD9kuFxJQ7BbYhinLk3BUXCFyrIqAiEA0nMqLMoeGDdOfPVhRHL2Pgcy7+/d7MXr18gBgHGE5i0="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_1.3.0-beta.0_1528682450710_0.17420594758761432"},"_hasShrinkwrap":false},"2.0.0-beta.1":{"name":"webpack-flush-chunks","version":"2.0.0-beta.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles, cssHash } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. It uses the `cssHash` string to asynchronously request CSS assets as part of a \"dual import\" when calling `import()`. \n\n\n\n*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n\n  <!-- stylsheets that will be requested when import() is called -->\n  <script>\n    window.__CSS_CHUNKS__ = {\n      Foo: '/static/Foo.css',\n      Bar: '/static/Bar.css'\n    }\n  </script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles, cssHash } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to \nprovide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \nSimilar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: ExtractCssChunks.extract({\n        use: {\n          loader: 'css-loader',\n          options: {\n            modules: true,\n            localIdentName: '[name]__[local]--[hash:base64:5]'\n          }\n        }\n      })\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks,                     \n  new webpack.optimize.CommonsChunkPlugin({\n    names: ['bootstrap'],                   // notice there is no \"bootstrap\" named entry\n    filename: '[name].js',\n    minChunks: Infinity\n  })\n  ...\n```\n\n- The `CommonsChunkPlugin` with a `\"bootstrap\"` entry ***which does NOT in fact exist (notice there is no `entry` for it)*** insures that a separate chunk is created just for webpack bootstrap code. \nThis moves the webpack bootstrap code out of your `main` entry chunk so that it can also run before your dynamic\nchunks. \n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks, not `main`, `vendor`, etc. \n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"88dbc9795da21f2f031887c9fe3b41f7d5ed7b11","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.0-beta.1","_npmVersion":"5.8.0","_nodeVersion":"8.9.4","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-6XhYh4Xe7ARtJTFn1X+buTfo41Ug2OCbIVSIykLtRKfutC5Tq5K9dTtp9/xb0hfY4NNNp13GFQZPEdoYMslc+w==","shasum":"c17d66c8586032b445b984d60f6e5dc6a75aebca","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.0-beta.1.tgz","fileCount":14,"unpackedSize":252837,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbHxIpCRA9TVsSAnZWagAA1Y8QAKF3fpOjJJOt4iClcDSZ\nPCw0HhXlcBDaPW7URkt1/hCVFStoQmNGfRP7AT20deQtMX/1IWgY0HMOtO1Y\nMhyd2L3WZYNHiyuS7TrkvpQLtUcxIekrBElOSyuTTT1pnd9XSme/wBztTsq/\niAKfc1P2f1P/mQFyXoEY5UUPGPfWHITDD3hZ59fRfUEnTDD9SWu1OykVbGzF\nRpejTidrBudmmUGOFXdtv++c4T9c6CS8CaEWGZnXzXd4v6K0ZMpKUCMFLC3U\nXxXxz2hgtBk6YUB7aWNoZtTewMqLXiQ8FEp1dn2c2ISL5Hgt2cBEkqoy+Tj4\ntAAOgtJANwF6fXMC9lbLw1HUwa4qjXm17j+IqqWIoJWKp1KTiZF3kyrvr2bC\nS85KxGfrTEG/wb71qG2004t6w3HUhlQSMWUCZXsysLdFCHfIyYGL+wmpwI7T\n5p7sn/g+QezRWvbXQhhjHbn891sLsW2XoPP4EkghT0LjiN866O0odnSbU4Vb\niu/59oHYFR7pH3x1IL94MjPpP2wkF7cx04HrwF8r8rpIpN+++cbH890Z/REK\nFxrOdg5zg1CHmAc362biFC75a2JUr2EHhI7JF/WSqBUpxdtxCteJfsWOS/OV\nMa/BOBKOkNXnz3kBvmTpFKh92WyNlOSrU2z2IN5+pRIULmxihyIfTp3k0kKQ\nkFCL\r\n=sCnm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCNhI5SO5B8Pdmp8WCVN0yd7Q0jVnJa1+j55N0uNFcccgIhAN32HH/bI6Fh2UWpTptU+j+2CBoLkjiIR4Q/WRl8Cgje"}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.0-beta.1_1528762921179_0.8359481020753399"},"_hasShrinkwrap":false},"2.0.0-beta.2":{"name":"webpack-flush-chunks","version":"2.0.0-beta.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles, cssHash } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. It uses the `cssHash` string to asynchronously request CSS assets as part of a \"dual import\" when calling `import()`. \n\n\n\n*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n\n  <!-- stylsheets that will be requested when import() is called -->\n  <script>\n    window.__CSS_CHUNKS__ = {\n      Foo: '/static/Foo.css',\n      Bar: '/static/Bar.css'\n    }\n  </script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles, cssHash } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to \nprovide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \nSimilar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: ExtractCssChunks.extract({\n        use: {\n          loader: 'css-loader',\n          options: {\n            modules: true,\n            localIdentName: '[name]__[local]--[hash:base64:5]'\n          }\n        }\n      })\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks,                     \n  new webpack.optimize.CommonsChunkPlugin({\n    names: ['bootstrap'],                   // notice there is no \"bootstrap\" named entry\n    filename: '[name].js',\n    minChunks: Infinity\n  })\n  ...\n```\n\n- The `CommonsChunkPlugin` with a `\"bootstrap\"` entry ***which does NOT in fact exist (notice there is no `entry` for it)*** insures that a separate chunk is created just for webpack bootstrap code. \nThis moves the webpack bootstrap code out of your `main` entry chunk so that it can also run before your dynamic\nchunks. \n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks, not `main`, `vendor`, etc. \n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"b553bb375366f3e8d0febcfed099ccc75e3ea7f0","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.0-beta.2","_npmVersion":"5.8.0","_nodeVersion":"8.9.4","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-myCgAp33kq5e8EJT5FB3eF2/LPnZwWDCpoytaUuvgV6vcA/x6uS/vf8oYxFnREawPmat5r84CSiszj7YE3vFgA==","shasum":"81d11e7f495a535dc34718091f5c1d560a04e6b9","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.0-beta.2.tgz","fileCount":14,"unpackedSize":253045,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbHz1nCRA9TVsSAnZWagAAbaQQAIPWq5oWimnxI5ePuFFs\nHSE7wV+bi6CO5EZNSrfAXAuRBV0CIbJ5MMsi4GGGEmwRFyKfJkPkKhKvRory\n6sz1Mwk3DzJqDWGsKyiMDpGBb3UGHSJh8Eveamxp8dRPF77kdj50afNwm/E/\n7FuMML6dsf1JVeQytqr98RslEaSHvSOoqqVkhBexbHfA+xBZK02kBxHAx52H\n+zzRG3Bp+Xw1YRsQlULmRLQoH6GsTQ0RBfMdNpN5p94SIEfeJwFhuuqA5Kwd\nmy1vh+mVLd9QN6DczlknFREhp6zglYBohpRytnslJXwU5aPLXKyVtMRA308F\nT/0vmizIMLF4DWgjzkpSKsjRww1M6nqMUNRT0tqen3Mlq9PNhRUNQc1OsF6E\nV5Ks5QJTcytIM2O8CMBkh1b+O+1dSU6d7RXMiD82q81Sjyx/mT4fx+lKSeAk\nw14MsYI38nSTe8Cp7A3rbI+xosMlEwPcAz385qwPrx6Ecdvr6+gX7hVZ7WnG\nlG49Gr1sJty3QxcO/MalbBo7/bmNRhbZaa0fmVGXRN5QNY+p5g0gQEDq3M62\no3gelckUj6V2IBd7V+D+KkEwF61Ug5KpqYX7mvL8H9ayIMvMGz1QnIulJx1z\nTakVnspdQQU//ZEVest5+Pa021M/YLjNHYmLOIzSzswduwCUz8Og0CsiduoK\nTMMZ\r\n=pDW4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGuYbGKtZq1AwiB5iEjxi+TeDd67MRqZjSR1EF9H6ZyiAiEAyPFjGzWE/qWz1ujRVnJ0FzgNgzTAZAn9+1+XL4Ml7HM="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.0-beta.2_1528773990559_0.35118361535361875"},"_hasShrinkwrap":false},"2.0.0-beta.3":{"name":"webpack-flush-chunks","version":"2.0.0-beta.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles, cssHash } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. It uses the `cssHash` string to asynchronously request CSS assets as part of a \"dual import\" when calling `import()`. \n\n\n\n*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n\n  <!-- stylsheets that will be requested when import() is called -->\n  <script>\n    window.__CSS_CHUNKS__ = {\n      Foo: '/static/Foo.css',\n      Bar: '/static/Bar.css'\n    }\n  </script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles, cssHash } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${cssHash}\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to \nprovide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \nSimilar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: ExtractCssChunks.extract({\n        use: {\n          loader: 'css-loader',\n          options: {\n            modules: true,\n            localIdentName: '[name]__[local]--[hash:base64:5]'\n          }\n        }\n      })\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks,                     \n  new webpack.optimize.CommonsChunkPlugin({\n    names: ['bootstrap'],                   // notice there is no \"bootstrap\" named entry\n    filename: '[name].js',\n    minChunks: Infinity\n  })\n  ...\n```\n\n- The `CommonsChunkPlugin` with a `\"bootstrap\"` entry ***which does NOT in fact exist (notice there is no `entry` for it)*** insures that a separate chunk is created just for webpack bootstrap code. \nThis moves the webpack bootstrap code out of your `main` entry chunk so that it can also run before your dynamic\nchunks. \n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks, not `main`, `vendor`, etc. \n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"19c606e7a02bbcd6fc616fd3f9d43e7102292f72","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.0-beta.3","_npmVersion":"5.8.0","_nodeVersion":"8.9.4","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-SpmmhJDPCKu4/KnP8FrwIQfjinwNtSLOZ3x8bC9qqkxGRKNtG9lByr2Y2mgjoenLW5wVgOu8gsfveDBHUmarUg==","shasum":"bf926a1a840554d8f9389623c702c6c7c70e86f0","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.0-beta.3.tgz","fileCount":14,"unpackedSize":252951,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbH0PgCRA9TVsSAnZWagAAvpQP/0XHI2Jt8UVKB4wDyY5U\n/kwlxO2l8WfaSucuonE7DfIc+RmmHd2iH/092pkCkrggsvHv3EZ4NVLuJ3cN\n/b/QwrU9CF2GRyheu8qKNe2vatAdiSJcGAj8GLzIZt9UaVFwtQVWJmB3nLMV\nzigRvGn+ZA+QNs2uVEP9lkMqLI+PKZmxG8XpcyuZTIoYeOB2chHc+mEL8Noj\n7YF71fcMtIYhtgYkAtQ9F3+PUxwLtSRVZeBDKS8fbV7S5kFsH1LEaZhc6AQf\nY3ZIohjVgSz7o9xZPg60t3f8JNExhH4zJgO35kUlqJLnSuNdT8lkjvIJ477x\nUs5IbE63EtkYcIzxBu6GMC6hq+7g43G2KoyER9ZiZabWnq8D5CP8JyO2VbKP\nlz7a4Ze+0Qw7w9GQrj2N1HXTTcqTgaHvotjND4QIlPHiL8vDEDdA7GF6kQuv\n5pmttHbWiJVaapLvVLwlAkCRqgl1UyHEh1FRozb8oo1TVZHjq+qRhnAQHQQW\nKjS/Y/MHoqfhSHRlLWGIKssqRh78uBCl0t9JI/StboWmtcF3Duh03v1C6mxq\nmN2pQmZ9O0dHItGX7zhmzAdJEqgv0iTSiXhdf2N+eiT7GFwks+Jx5IhxWNos\n6O9vJS2A5bumkgYPpBvGggfmRrgRlKqMO+6mv+NfQWZQtUotKHzmh/C1DZxc\nLnsv\r\n=W0rm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFCnb6IGfR2Gr3wQeb1VFAk5pNdl4xcaG4mLS+lo1njwIhAKRrOuMD5BWsmmmX/P2IP/Lwux0JS4JxWTiUpFjt+wtq"}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.0-beta.3_1528775647831_0.0621026359440926"},"_hasShrinkwrap":false},"2.0.0":{"name":"webpack-flush-chunks","version":"2.0.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"8bc70e79171ddbf8c102a86fb351c201ce91e6a1","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.0","_npmVersion":"6.1.0","_nodeVersion":"10.4.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-qqO9Tw1STyW3ao2tW1vKST6T1V29OZF4PHlycs1SeTqnBFlnUacGbJ0WHBE/N3L6dusPYF8aeUFjq/ln6n/ZFA==","shasum":"3d9a7ce72b71aa659d3bd63f00e44b5d14931ca9","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.0.tgz","fileCount":14,"unpackedSize":252619,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbICZUCRA9TVsSAnZWagAAejYP/0hW4tHqLLHZJynA8tGw\nvZICzXnEGB1LTsjf5fEWfPGgSBJGntRRDencJiJj3l+/oMaGjRIz/SK1T+Fm\nby8N+4GIJi493dBMxv2mx1jA3Y74ElP0AeibKSPkv1WOJR3uLjW2p0VLx5vs\n35r2jPNGmDSWN9e99SIMmK/oG0uPyl95MQ07ISpAW2J2keCijqHBgTVsQ1X4\nWenyrCOVeB5tbyeoTifrKJZ/5qm8QWHkitTLIbFu4JUdJNw3PFzvlFX6ejgs\nzlwZ57bLy4PiPpDSVlSYnFUnq6YjVeTVvi/EG4VUrO1XxCNI6PD9+Ohou7Rj\nvWA7WOCBcyzNGfl81j3GNMHflHiKbqkHKME+7e4zIIt2P4EFcsj9RNKQcEce\nepR5fKTdTMXNnULr6Cg2Hrv6K7EMzhRXlpHgSq/gEVQX0lLThfvUXYD3++RQ\n4H+fSPMN3YCh3AIrUUnxfafPtKDtQXAyS3NtkICdZepRZo+NMzkD6KtXPwqq\nm9yMwRE89yFgkPwRlcueCcj4SoBJJu9ggBs4iedi2loAhxFwi+hbOZ3uje/w\n17iFxIiTSSyxxMIEOc6TAtGvIRZQUp6Bz2mIFpCT29759NtVlbWJzTc4GKku\nD+EpKjPoaPh3l1W5Y6rg7l5uH3FEQB2uvIIwg+wIlbzEqs1GO94NNSPGNV3n\nTTNI\r\n=/aJ1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCdkrt8yaRmTow4iQ91g0k6ViMiV9ziSvjpBWOTOpuVngIgAi5kK4Mqta/kZ2Bc7nqYxvyuUjCZ6vRF+qUZOmzqSes="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.0_1528833618510_0.8740961101310063"},"_hasShrinkwrap":false},"2.0.1-beta.1":{"name":"webpack-flush-chunks","version":"2.0.1-beta.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"c2c4d4d7f49cd82affacaf6545b7d7c7a5b338bc","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.1-beta.1","_npmVersion":"6.1.0","_nodeVersion":"8.9.4","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-r2z9yICAQz83gH2pBMw2rXqKjvSj+mFQvmUs7ZwADRxY5RyVrpDSZfaXibuzCbJgSRV0RMCKvgEwq4mtmi++gg==","shasum":"c5da806e141e85a7890e7eb8a09681109ce81718","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.1-beta.1.tgz","fileCount":14,"unpackedSize":252661,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbLGjZCRA9TVsSAnZWagAAyR0P/RKBWRJlWRM8iExhsIZs\n0SeQd2OF9TRWjpkDHRhJt0OcQiOAXXPJUjeVTVYETo3iX2mPKToAtIfdtkqi\n2xTsNxzhorjj0+ZsZB65tPapqklT5Et/tz03rCQqMvwGrQhfHXAZ0iHi5amu\n2N2qSpq3D8mh/JHC+ealJoCDhevAkl+0FaV3pzKiO7Xldt/ma7D3rVltglY1\n9nMljRJsVVRLcl+rwN/+l85bRFGWyN40raGKymp3Yvegih9lQs1OpoKTTO5i\nshMZvVCPpNoG0KIBnvB8pkSlrSmFmQ1hcIgEUn+eJmZwCTpHzLTd55F33zSU\nZUlOKia4O+tUz20CIUtqpbPpKbDFspNRgYU/WzWOlO0ii0u26KphcDXZsur6\nVCSnR5PWm9CUcU1aARW84nT0/iXo96jci+edcUR+HGtmd6UHwxIdsNyTHkm6\no1HlV5odgz69v/+d1ogrnMs02mBKRfvRTgamg1y1RBrEPukP39aNr1WBEiRz\n+CxyDV9a8vNMVHD72izZ9PdWBbqVo6eeKuvw19pD35xzz3zbunyw3j8kZkNd\nxyU2EuHECyVJZqxMTqJtZeoflTGp3pUrpk3SMDP/W70wrmiGhlqIZlK2GRY4\nKVQGG6gs0IHZ62TOv6BZ9tdLzvZMTKKxmLtuIYO6hgZCC3Lpp3z4EWlvfm+Y\n/kxV\r\n=94Nm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEJ8ybnZoz0/8EOwDdzEM+rid72F/DErKgBq35AKuQB2AiBWLrybEAEOgWNso6mAEQKn4dcd8iC3TNwhjPUtcdem9w=="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.1-beta.1_1529637081684_0.16679301649131628"},"_hasShrinkwrap":false},"2.0.1":{"name":"webpack-flush-chunks","version":"2.0.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"f66b2f15bcac0d43e24a98be156fff6c51a15609","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.1","_npmVersion":"6.1.0","_nodeVersion":"10.5.0","_npmUser":{"name":"faceyspacey","email":"james@faceyspacey.com"},"dist":{"integrity":"sha512-747pOnSiLjFs278kcH327V8eBL4+GQ8lkNpFTMwmPOsmUgodbgIX0kVW+EeaC9pqv/AwKL/9xBHYg7lDKlI74Q==","shasum":"f50c256b4c282e35ec0d60add3b0384a75f4fb5c","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.1.tgz","fileCount":14,"unpackedSize":252653,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbLcKfCRA9TVsSAnZWagAAWDgP/3m/QoGqEXky8pywKJoK\nQOPBxwKzpVJaaMBMaDV0SqljembNURyU0o17SKiw9Cz1+4OcEKf5gYJgpHCS\nfV1R7M2F0Sozovff8Gnni//K5uEAhXGatwUmzk2w5IeC3yngOWiV8XH/xxRu\nkUdqSur4BscidJiFBzfWiPwuv/fkdCmu9qQNtU73wQEyHk/0qWlUWz/Ulfd2\nAlWx3mpB7Zuc9uSBCEFnzKJ0Ya20v2BTuu6ajOiXyn++WJ5SwHLOmDbUbgEz\nKaLASTWGpMUC7O44HwseM7lH4moLqmmf/JX04e/A2EMQ5NK+Dv3ktG248cE3\nOQ2uPiEEwc6kYnJdId7w+Rz9KZcojSC39NiVdJXvtegIjoSvbYWypCsTjjsA\n9naJAL94HXLwuZk+JYD6kEP9q0k5BGfH/fyvxycxXd9x796Ej1nZ31kx65PH\n+FfKarTaJUFxOj+BpuPYEADY1aflESRdVGuqIfbhp4hlKkSYCrGMmSyjcjnc\n2gjM2gJ/Dm/rLqWrBPS3UAQlGfhhHKJPX9F/D1dctxvD95htS+R0bHC1USDA\ngzS6Z42SZQRWyrba8X5cK2LGOhVewssF1xzXU9sDBlFf6PwpcRQ9/PnqKceJ\nYXWpsLYf1cYuySUHXKymeQ1rG/to6cJdlHWGiMsESuPVT6E/WDNR/rZaXJCx\n6+rG\r\n=/3Hz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCU8bTkhWvwdbhU0nCKZixlEK5kbBke6sTpEmoHb5PQigIgB6wWj3nurICIKDF0Gs6vaH9aADF4hwi5eb2NuM5h7fg="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.1_1529725599027_0.07751199261223074"},"_hasShrinkwrap":false},"3.0.0-alpha.0":{"name":"webpack-flush-chunks","version":"3.0.0-alpha.0","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"a4c98fc16099b706b2900745b709c15322f29e8e","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@3.0.0-alpha.0","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-B+PKyQFweR1f+5DviC+vTsHdhnaDaRaMM88S7RoIZaLA8ag9AgXG/3Ql/bWSYE2PWvN4UC+xCkWDW2OwGkCwgQ==","shasum":"b93702ed2c797b322c5c54fb42926b261a6202d4","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-3.0.0-alpha.0.tgz","fileCount":14,"unpackedSize":253147,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbn+qCCRA9TVsSAnZWagAAvgUP/2gG5/7KDE8NlHtcMT3Y\n1+wXH1GqcwFg0ECJZg4ciDTKrtughtqGRTmAJZk65P6cHbwMfY1ugZBnQSPd\nQ0mbaSpyR1TYgCQzEYj7QBim0Tqb5KDek2BEUmRXGsmLouINeUlIO/wv+/h1\nHMZFx/uyBD5Z+SrvSuowZjgbPL0rM56Jmq+E1F6N7uLzQ9pr3PfW48idcWQf\nyc3cq64Qp4V9qF4CtefhnAVmv2m/Z2InF1vy5sfYo3WgirIDCIH2xD5gYBLj\nRIAdDAd76HJBtKiTlK7GdHBqlLaX0jJXZaCy4N7z02eQ6HhinMDXqpgJh2q8\nQpl37nyzYIzWCLpYE7sN2Wx6zyXkrkD3xCM6mCC5CuVk/fwJGQFsY9NO7my3\npE0xPdpRSBPq+kgHUXmbY8hd8PMxNQn3WxksfAzsfh/phoLAfDn4JWppI0QJ\n8ellbXX6YG132o5gBdq8wFEJIjeb0m+FWUbvst7QsGwDTsp+CbGqwPMwsqzI\n0Y77phFjRhwmXtowTJoaLi+8FjA0cm/sEqbllJKxqgLf9YzR8RvzGayLCIBS\nRfiPA+G21cd3J/aKJ39kEgzVx0yiCZsFouCBjRqKHlu/9oB0aZIxxz+TlwAD\n6pie83RAszq68A1JI6eX+Hp1oohL9vA4HtF1QD9X+IYkoklh17IgrpgLJz91\nwKfC\r\n=m1h3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICpofyOl/dXlFHMf16XiLUXQiDIGBXxX2GY9G/zOlFdLAiBaJMYwGSme0EQJRSnIUxMtpEK19VfEqfJNzTpT0BaC4Q=="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_3.0.0-alpha.0_1537206914000_0.1041050380587325"},"_hasShrinkwrap":false},"3.0.0-alpha.1":{"name":"webpack-flush-chunks","version":"3.0.0-alpha.1","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"a4c98fc16099b706b2900745b709c15322f29e8e","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@3.0.0-alpha.1","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-TgM29siVcLv+iKhJKvpjyCmdvcwX5AWr5N+lqCvOTV4K7NsuCvTZRDZpF5y17ElFHh364h11okvWPUxjldI6KA==","shasum":"e92a8ab70b16dfe4eaabb6a8cd4f9c4378ad1e12","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-3.0.0-alpha.1.tgz","fileCount":14,"unpackedSize":253151,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJboWV4CRA9TVsSAnZWagAASCkP/iJJ2OeAUIlqrQSflA7Y\nvV/MgHAh5M4RWQLBvnTZKI3gaKvI+gGauJN46DQW3dA8SdG/HY+waJ9yhwlR\nng6Jf+o1cWNvtsDbxgnhJ3dRU7nPM00mnCe5MeZDwGs4A2jVlfHXG/+R7Vat\n5A7LUVj4jRFoiVRv7KCSrN+J6EMPmN3UOyHn/jYCJA/aARv1/St+wHJgvXkL\nJueTmRfGFpCAszeFmNMIgghUWRt0/83u6lZR7U+4BLZLohhApjbDMD/pnEok\nPnr2yhZbXebajBinN4HvCDF5RLo+7wmoWlpZOYO/ICaF1bQQhVjzSPWOAAN5\nJvvFpBsNGLfcROjkVJHjXUWY2fvELi+0cES/CBpnoTNMs3Az+NCZFudtBd5w\nGhQNLAd2yR6ZtZg2iFfs5XOl28usRSpEHv0yiyhxiGB96YlI+iYAMMs+Lh9R\nhfXHjTLofDwYxFpSIxMb8S5rhQSJ+5BzGcBkpIURjeTLNFMgGQAgWTnZy3dw\nlTZrBpX3I9d+AobXGZBwATykyVsKCpQT+IeVP7GmI9t3aVQSjgdQ3sfhhr3I\n2VxtfxkdILAhiKWRaL17TbG4iK+UUOMF2UNvEVLvSOrbAERtnodvw5YII0gf\nvaNIe/w5hlpupqIPhZUPRZjStypwQbTY0QLJEhzO9nuVMlqEczJQJFSHtwY2\nkCLi\r\n=BJRT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCqjD9+f4aIS3lPk2l+d0v1K8DhrjvvPsoqGVheNS007AIgPxxb1o4ReqsyzXVHEvwsQbmozP8IQwD4F20FLdMWwJQ="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_3.0.0-alpha.1_1537303927452_0.33767350312929745"},"_hasShrinkwrap":false},"2.0.2":{"name":"webpack-flush-chunks","version":"2.0.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"2b0bd08954d8afc4211274009e2fa751a7e99353","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.2","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-U+WBQUUAAfy3m+IqivoMJgtPBgam3Um/nIr8cmLyTOQvfXjKelmjFtzggdnnV554rFvIssgX/EO7bEzWHyqUqw==","shasum":"d3fc24a7fa2a744d2982173b7e5d2f283aff3d5d","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.2.tgz","fileCount":14,"unpackedSize":252863,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbskDHCRA9TVsSAnZWagAArUoP/2ckSwlwIrRgsBpIWtSa\nJmWrFx+vsQiybNwFOssH8WNXjYvePdIzDOkscJgILOjdT92RyYFF8wJwqsG9\nN7E60O7ZMRxP5mucMWpCWEDetO8bc+z69yFF8fstP7Hqo3y6Xt8oBJX9LUPG\nNKihNPg5HreaURXvjqohTIdm/MIej4dpkeQswe6uZXTNCF+r64farwCH3xbf\npg6D01hjF8S3zV/Ck2UqL7hmcAfbSxVAoy/EObqvOLDArOpB4sBMqU5ju/LK\n5n0bpdMqFA8XCBXbxi7NdAIGmvMNbiF0yg5dhaqJwKVkoVMRmRblnCXmupgn\nH4CSAcIlawvP6SQMWcAD9eNYSx446tZUQeDwiSOPUpPZTrnWko7LKLSndKO5\nrGBkSNjb/F7Oh57y9jXAG2LKbn9/IPHELZj1V2A5z9m9Pd6+T82Wp2BSaiaa\nAaEx4f0FOpGDQBn653/fTqbKiZWRk2dHqNs/2HNO5P6CQkFDcXN1ICjEte2Z\nf4PXJrsAYorEmUQMRvaBzzp+Wyo6kyshCxDcZle3W+Lqk5MzRc7jgHANN1Q3\nnyzHHiQncDeWFM6aZICy6BfCKc34q6+LiHfue+QkOQC7EG7dGrnJNOZ7HUfT\nz8rlH6BUbd2QO4ZEi4vkyFDDSscyPcBoxQv2PCHJqU4YNHngf0GxC39uwlOG\nWWe5\r\n=asOw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD2vxNbQYU968+gu4k4lB6aO+N753h4DXX/obxD+unebAIgEJdI/girfwAYpC7WOIIiCMXQIljzt3ashLOYbz0fv4E="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.2_1538408646432_0.7103860016145094"},"_hasShrinkwrap":false},"3.0.0-alpha.2":{"name":"webpack-flush-chunks","version":"3.0.0-alpha.2","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk strategy. What the strategy did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"2ec1840fbd8c240a93049613dd37ce412a0ab518","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@3.0.0-alpha.2","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-N7Nh72sEg0ClZuxSiP57R1veY/rfPshcxoaEg8b3/HSUQZ+MmGGwzEFfzzEI3hLF6Bm/E/1qEJKM5T8qd0ywyg==","shasum":"ef43839cbd3a786e9df552fcc66820c5cea91e59","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-3.0.0-alpha.2.tgz","fileCount":14,"unpackedSize":253470,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbskFZCRA9TVsSAnZWagAAnA8QAJO4TowWFpbSCkzHbjv+\nqCV7pFe5/5YCwxySsI5fFfTj1O+Xax+JhA1jHxD/ZRKNLsSoaO9B4G6dlVj0\nu9in6UlzqOVJTmIxNq1ftVvu4grdDA3/iyiabboBm5PqWDImWJiJrvehCzuu\nU2iyz2OAE9FEQICPn6qHIHUVZ/Fy4W/7UbypGIWltVj0rxRCHLceraWZmy5t\nFurTCBFPss6FdcXV7C175qKu2H5+x8eUJ6ZltryqMtoCnyIeGbRlfpAXZf2O\nV852E2rQ94kPDsXBbNOiAQ0wEViuwGkqEKMXr2DrWnhgxjIsPOPaaw6xvMum\nzxEaPTKlhGgNKVNyohCswNhRG6KVVvsUNKJkDYF1gu4kxOZ2yXim5LYZV0Fs\nmVJDFeeDmCkKi9Yq5DxR0CYfdTpIACnDYsqEFAkig4kwKUAFfqhGEcUyW7JH\nwpJ1/oDgABgu9e9cQp2KU+Brl6Q6J2M8Jg5Q9icvztKNzINGL4DltopB2WrM\ndtn+cJP0RcxdIe6Y6jLM8dvOAtU7DHSuEqrSLqTFpnUrw6AY+Tjyt6tGMY/3\n4Ia5GaEozOhuWLRWBDZg55aOm7jw4A/o+hKc/0tx046f0ZeZqy2ZbfgXfZP8\n83XRwFplVw1RdZd5Y3KvRYiO1xayiAdRU0gzJdBsvQhVa8DlhooUP6v1FaNc\ngtUq\r\n=o76L\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEYhHeeBLMur71rDm6lcbL/gX+fHomckTtB6VA+e3PNFAiATnW9klIMfe80LYt68g5sJPiIYo+UwjKRJsxomPSHtfA=="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_3.0.0-alpha.2_1538408792795_0.16434242406037547"},"_hasShrinkwrap":false},"3.0.0-alpha.3":{"name":"webpack-flush-chunks","version":"3.0.0-alpha.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"ab939d57e821104937c05a8439e9a2224365f782","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@3.0.0-alpha.3","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-vc5cRxwidGGLk8lNupm/ODCCGxqxFxuA8KFkDmCnan2ATftwXtVkgYZJ0IB3csS7vaE0cYui0pszHT3midRn9w==","shasum":"5e5254a8c02924b8f7a24b109cde3c552d162f59","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-3.0.0-alpha.3.tgz","fileCount":14,"unpackedSize":253221,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbsunoCRA9TVsSAnZWagAAv40P/jeOw69vRAH0OI4nnycJ\n75P44oqhU1MnwDVNXjuMB4tyDRSBdGQTlv0OPWJGbK80gzyKIw6y+Kl8M/XO\n8RFG2Tfh0i73218a7CmmGR8ZWgGoWLifI3e8kJSa+R2grmg2dPg1+SEKNLA2\nlEx7avlpc5RdgzDCk3MezNH4V11C5Ew8cjqLSoOQ8at+qc6eYiGEk2HolO46\nY5hkC8QEkD4ljukFLDDixNp2BSSPvW7y4XGeUiUzG9GylKoAAuYO/G8uQiiM\nJzvSXijui4Ds5+5e6AC+KOChEyxCIHa/PG/EQCsn11oYrhOaLaGesvYutImT\nJ8lncrHS/w5BSo8FDcJbnwVAJbu58WVBx64FObPflfUYq52U1qIBoLO+q4q9\nsUqDYHnpJ4250G+RHQvExZbJue1ZbdBVjIcAuDeJKhF2gz4nOR/BQ4pSGuVo\nAArixfM2wHr1HAuIOocN2SWA5LQ3QjJ0vWJwp4QW/JxbzPT8Bh3MeySMMpmi\ng+VYdcLwOBIW7awK+YonlndM5kxwY/aM/RPFNrzld3yKzXLhxjn6rQIWf4UY\nm8Nr/2QNTmAUi/HhlYnL5C1C8txNdOGNQE/+1BGpsQgKLQ5BBt0JukdNBhb7\n5WdM19pAuwPicp5WoLNv44S09iwNhNgvudMCNt9PK9PjOvcfth7W9Ucn3Pqn\nPUDa\r\n=1gry\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC0H2u5iq8GwhncW8ZyA71wNdrxE7QN0H7u27dStso6/QIgPOjTmcyURDTWDfp4Zp5K6KCDN0QOTuz7GA87UqGipkY="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_3.0.0-alpha.3_1538451943833_0.06852056518628391"},"_hasShrinkwrap":false},"3.0.0-alpha.4":{"name":"webpack-flush-chunks","version":"3.0.0-alpha.4","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zack@ScriptedAlchemy.com","url":"https://github.com/ScriptedAlchemy"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk stratagey. What the stratagey did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","readmeFilename":"README.md","gitHead":"35d5b7b8b40cc7d20354fcd1f29ba618d81e0fb3","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@3.0.0-alpha.4","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-Cpkbm93uOXnamm9qGkPiQxV6xH8PTFVpDv2HGHFEFDo8B0UiEs1UDzKExs/Slebo/wRMsn2BIlNO+U5j12BReA==","shasum":"2f91506ebaf244a60dd671c2aebb3a5c4367c372","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-3.0.0-alpha.4.tgz","fileCount":15,"unpackedSize":253320,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbsvJOCRA9TVsSAnZWagAAsU0QAJbwHs97VZ4ikKzLG0Nn\nJWrotI0KGsdKf3WvxDiQpU2GqvvPVSGsvaazHjzKU3YBWhkH3sSHgeFEyjct\nyy5OVq2cakSNC9ubaSZGzkrJmfZ7hn1fgXbDyCuhQ5zHI3zaGbkencjYlrgQ\nNZ+rJMe2PUjWbwnnUgJDNztCmTxdoDig5TpDVnAuq7MPjPaBBowWLAsKJ6DV\nqxCVj01aZBZ0ZmbLY31aylHjP69Pfq145LtQOf+XRZAqdjgk0t5Q9UEvn5bx\nimRziImrDNx/BXJO5Q/+CRNpMExzJXb8gewOPDyQPOkgSh/xhgceFmubN5fY\nqdK/Bu+rYJ+S3iI6De2hdfYdoODVAZ/iPDEG3eq2IIsdoSh1ezy2I/wBWzl/\nZpl5flwePVtUqzLNtglYx3oGF0qCUSd9mCjA5kuvNc2aE5LFkIk+uIl+Yqd1\n+zHgfA2DwLL2F7GkzvBpLHsG1unL/dcUOaxrj08Tb6CSTPvBjNKWVC2pMkW2\nRrRzdfdvOJrY038mI8jmV66wavkbWLUzYpQGZO1vk6w21C2kas6o5oY6u04t\nycUL3UtGdWkcuB8spktNMtX745CjUdGwiBQY8VSBh1uHOKhWBR/ZuiAHoWB3\n99d5znL/mtRfj4iIDgufQHhygBiubw4fCO68lUQcRcyi6h9NHdDYAu9FqQWH\nDi6h\r\n=SS2g\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD7CwAtUFiW+DdgM7Aopd39cIGLQwhJGhYb7I8NHNuRbQIhAI9zn50ysWIt5HDAPkee/sSbthH/3/zkIdaS9jzcUOs/"}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_3.0.0-alpha.4_1538454094106_0.019532843726657534"},"_hasShrinkwrap":false},"2.0.3":{"name":"webpack-flush-chunks","version":"2.0.3","description":"flush webpack chunks for SSR from React Loadable or similar packages","main":"dist/flushChunks.js","typings":"index.d.ts","author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}],"license":"MIT","scripts":{"build":"babel src -d dist","flow-copy":"flow-copy-source src dist","flow-watch":"clear; printf \"\\033[3J\" & npm run flow & fswatch -o ./ | xargs -n1 -I{} sh -c 'clear; printf \"\\033[3J\" && npm run flow'","flow":"flow; test $? -eq 0 -o $? -eq 2","format":"prettier --single-quote --parser=flow --semi=false --write '{src,__tests__}/**/*.js' && npm run lint","test":"jest","lint":"eslint --fix src __tests__ __fixtures__","semantic-release":"semantic-release pre && npm publish && semantic-release post","prepublish":"npm run clean && npm run build && npm run flow-copy","clean":"rimraf dist && mkdir dist","precommit":"lint-staged --verbose && npm test","cm":"git-cz"},"dependencies":{},"devDependencies":{"babel-cli":"^6.23.0","babel-core":"^6.24.0","babel-eslint":"^7.2.3","babel-preset-es2015":"^6.22.0","babel-preset-flow":"^6.23.0","babel-preset-react":"^6.24.1","babel-preset-stage-2":"^6.22.0","commitizen":"^2.9.6","cz-conventional-changelog":"^2.0.0","eslint":"^3.19.0","eslint-config-airbnb":"^15.0.1","eslint-plugin-flowtype":"^2.32.1","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^5.0.3","eslint-plugin-react":"^7.0.1","flow-bin":"^0.47.0","flow-copy-source":"^1.1.0","husky":"^0.13.2","jest":"^20.0.4","lint-staged":"^3.4.0","prettier":"^1.2.2","react":"^15.5.4","rimraf":"^2.6.1","semantic-release":"^6.3.2","travis-github-status":"^1.6.3"},"peerDependencies":{"react":"*"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"lint-staged":{"*.js":["prettier --single-quote --parser=flow --semi=false --write","eslint --fix","git add"]},"repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"gitHead":"3bcf73a158183b2569688f47f3f9bffe8aaabf25","bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","_id":"webpack-flush-chunks@2.0.3","_npmVersion":"5.6.0","_nodeVersion":"9.10.0","_npmUser":{"name":"zackljackson","email":"zackary.l.jackson@gmail.com"},"dist":{"integrity":"sha512-CXGOyXG5YjjxyI+Qyt3VlI//JX92UmGRNP65zN3o9CIntEzfzc1J30YTKRRvF1JsE/iEzbnp5u99yCkL9obotQ==","shasum":"77a4f18d101f889ec33456a0c64a8c0f8b4600db","tarball":"https://registry.npmjs.org/webpack-flush-chunks/-/webpack-flush-chunks-2.0.3.tgz","fileCount":14,"unpackedSize":252915,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbs4BWCRA9TVsSAnZWagAAQZQP/1iTRPjXFFEPL1BaDyJF\nyi6vSWyQDrODwj4gzyxlzbbEmTMV3zjKmd9ft9ZknvlkkQo5MXHmukU6LvBl\nEY6Dwd8LNr9wLKkwZhfqBuJ64I7WY5u/JiCLwqAUh8xDqTP8t3SvG0GbkFlT\n2zRN36SL1iP20agiAjol9q6ZHiP3mVeiyrV8Ejh5Oc5xrFrEvTKYQA4ORcJF\nhqOIS55W0SecAYWwpVLdhxxMvIGR7tANymcTlKqpn1++0vxoOznn+oFvnxbG\nQ0LGdpqQAtOYhr6rKWabkEpSL+EX8uTb2r29tOZYiwe3DUu59QOTxehM5Wuz\nf++AmcMIwNYElFJTOAm1ZxNfGPKfAEHmxdxFGnIcSKJTV/WvFtKVCV0Flzdv\npMhD5uaDsEobKvAjMsKMc9N5y6lYa0wxVFLl/lY0+RJM1ZsMbBdbCeTwH8a5\npvPHKr11VE9JXW2MgDwDx8B/RiYZcxMjAx4h9E4qaWIf1CPHBUSwhxCv4zU2\nnd5Z+CzOXCeAn7J9NYcjxdHi2RVM1o1Bf3ejc33M7znvP0vihZ4Jcj/PD/bE\nUdfTrmslpQ3apPcWlTqkIhkxyLV3Xf8NbqqPicAAdrcBPqf2mbUmHHWTE0k3\nPC+JoW+h9lKYaPEVhm2lWd6/wX3njSY7WDgXzjcIPR7PXZfH0qcZz2NfAdfE\nOZwG\r\n=JL1n\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHnyqDLEU9ElKO+e0ynkdhkPpj1eMW01MEv7RDcZA3bTAiEA/qPjpUnbTe7tQrYzzv3+3gP3ij1+VFZEOUcJ03Kpi64="}]},"maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/webpack-flush-chunks_2.0.3_1538490453338_0.22375392365583124"},"_hasShrinkwrap":false}},"readme":"<a href=\"https://gitter.im/Reactlandia/Lobby\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"http://cdn.reactlandia.com/chat-badge-reactlandia.png\">\n</a>\n\n<a href=\"https://codesandbox.io/s/github/faceyspacey/redux-first-router-codesandbox/tree/master/?module=r1oVP5YEUZ\" target=\"_blank\">\n  <img alt=\"Edit Redux-First Router Demo\" src=\"https://codesandbox.io/static/img/play-codesandbox.svg\">\n</a>\n\n\n# Webpack Flush Chunks\n\n\n<p align=\"center\">\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/v/webpack-flush-chunks.svg\" alt=\"Version\" />\n  </a>\n\n  <a href=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://travis-ci.org/faceyspacey/webpack-flush-chunks.svg?branch=master\" alt=\"Build Status\" />\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/coverage\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/coverage.svg\" alt=\"Coverage Status\"/>\n  </a>\n\n  <a href=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks\">\n    <img src=\"https://lima.codeclimate.com/github/faceyspacey/webpack-flush-chunks/badges/gpa.svg\" alt=\"GPA\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/dt/webpack-flush-chunks.svg\" alt=\"Downloads\" />\n  </a>\n\n  <a href=\"https://www.npmjs.com/package/webpack-flush-chunks\">\n    <img src=\"https://img.shields.io/npm/l/webpack-flush-chunks.svg\" alt=\"License\" />\n  </a>\n</p>\n\n<p align=\"center\">\n🍾🍾🍾 <a href=\"https://github.com/faceyspacey/universal-demo\">GIT CLONE LOCAL DEMO</a> 🚀🚀🚀\n  <br> Webpack 4 demo update in progress\n</p>\n\n> **Now supports Webpack 4 aggressive code splitting**\nWe have updated `webpack-flush-chunks` to now support more complex code splitting! `webpack-flush-chunks` enables developers to leverage smarter and less wasteful chunking methods avaliable to developers inside of Webpack.\n\n<p align=\"center\">\n  <img src=\"./poo.jpg\" height=\"350\" />\n</p>\n\nUse this package server-side to flush webpack chunks from *[React Universal Component](https://github.com/faceyspacey/react-universal-component)* or any package that flushes an array of rendered `moduleIds` or `chunkNames`. The preferred approach is `chunkNames`, as that's what [babel-plugin-universal-import](https://github.com/faceyspacey/babel-plugin-universal-import) focuses on.\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst { js, styles } = flushChunks(webpackStats, {\n  chunkNames: flushChunkNames()\n})\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n## Webpack 4 Aggressive Code Splitting Support\n\nThis plugin allows for complex code splitting to be leveraged for improved caching and less code duplication!\nBelow are two examples of well tested splitting configurations. If you experience any issues with bespoke optimization configurations, we would love to hear about it!\n\n#### Before:\nBefore this update, developers were limited to a single chunk strategy. What the strategy did was give developers a similar chunk method to `CommonsChunkPlugin` that was used in Webpack 3. We did not support `AggressiveSplittingPlugin` \n\n```js\n    optimization: {\n        runtimeChunk: {\n            name: 'bootstrap'\n        },\n        splitChunks: {\n            chunks: 'initial',\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    name: 'vendor'\n                }\n            }\n        }\n    },\n```\n#### After:\nNow you can use many flexible code splitting methods, like the one below. Webpack encourages aggressive code splitting methods, so we jumped on the bandwagon and did the upgrades. Just like before, we use the chunkNames generated - then we can look within the Webpack 4 chunk graph and resolve any other dependencies or automatically generated chunks that consist as part of the initial chunk. \n\nWe can load the nested chunks in the correct order as required and if many chunks share a common chunk, we ensure they load in the correct order, so that vendor chunks are always available to all chunks depending on them without creating any duplicate requests or chunk calls. \n\n```js\n    optimization: {\n        splitChunks: {\n            chunks: 'async',\n            minSize: 30000,\n            minChunks: 1,\n            maxAsyncRequests: 5,\n            maxInitialRequests: 3,\n            automaticNameDelimiter: '~',\n            name: true,\n            cacheGroups: {\n                vendors: {\n                    test: /[\\\\/]node_modules[\\\\/]/,\n                    priority: -10\n                },\n                default: {\n                    minChunks: 2,\n                    priority: -20,\n                    reuseExistingChunk: true\n                }\n            }\n        }\n    }\n```\nThe code has been cracked for while now for Server Side Rendering and Code-Splitting *individually*. Accomplishing both *simultaneously* has been an impossibility without jumping through major hoops or using a *framework*, specifically Next.js. Our tools are for \"power users\" that prefer the *frameworkless* approach.\n\n*Webpack Flush Chunks* is essentially the backend to universal rendering components like [React Universal Component](https://github.com/faceyspacey/react-universal-component). It works with any \"universal\" component/module that buffers a list of `moduleIds` or `chunkNames` evaluated. \n\nVia a simple API it gives you the chunks (javascript, stylesheets, etc) corresponding to the modules that were ***synchronously*** rendered on the server, which without this package would be *asynchronously* rendered on the client. In doing so, it also allows your first client-side render on page-load to render async components ***synchronously***! \n\nThis solves the problem of having to make additional requests to get async components plus React checksum mismatches when the client expects to render a `<Loading />` component.\n\nIt offers 2 functions `flushChunks` and `flushFiles`, which you call immediately after `ReactDOMServer.renderToString`. They are used in server-rendering to extract the minimal amount of chunks to send to the client, thereby solving a missing piece for code-splitting: server-side rendering. \n\nThe dream of **code-splitting everywhere** is finally here.\n\n**Reactlandia Articles:**\n\n- [code-cracked-for-ssr-plus-splitting-in-reactlandia](https://medium.com/@faceyspacey/code-cracked-for-code-splitting-ssr-in-reactlandia-react-loadable-webpack-flush-chunks-and-1a6b0112a8b8)\n\n- [announcing-react-universal-component-2-and-babel-plugin-universal-import](https://medium.com/faceyspacey/announcing-react-universal-component-2-0-babel-plugin-universal-import-5702d59ec1f4) 🚀\n\n- [how-to-use-webpack-magic-comments-with-react-universal-component](https://medium.com/@faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a)\n\n- [webpack-import-will-soon-fetch-js-and-css-heres-how-you-do-it-today](https://medium.com/faceyspacey/webpacks-import-will-soon-fetch-js-css-here-s-how-you-do-it-today-4eb5b4929852)\n\n## Installation\n\n```\nyarn add react-universal-component webpack-flush-chunks \nyarn add --dev babel-plugin-universal-import extract-css-chunks-webpack-plugin\n```\n- ***[Babel Plugin Universal Import](https://github.com/faceyspacey/babel-plugin-universal-import)*** is used to make `react-universal-component` as frictionless as possible. It removes the need to provide additional options to insure synchronous rendering happens on the server and on the client on initial load. These packages aren't required, but usage as frictionless as possible.\n\n- ***[Extract Css Chunks Webpack Plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin)*** is another companion package made to complete the CSS side of the code-splitting dream. Its also a standalone plugin thats great for codesplitting css, with **built-in HMR**\n\n\n\n ~~*If you like to move fast, git clone the [universal-demo](https://github.com/faceyspacey/universal-demo)*.~~ We are working on a Webpack 4 demo\n\n\n## How It Works\n\n*React Universal Component*, when used on the server, skips the *loading* phase and syncronously renders your contained component, while recording the ID of \nits corresponding module. *React Universal Component* may be used multiple times and therefore may record multiple split points. `flushChunks/flushFiles` is then able \nto determine the minimal set of chunks required to re-render those modules/components on the client. From there it outputs strings, arrays or React components \ncontaining the precise javascript files (and CSS files) to embed in your HTML response. \n\nThe result is a server-rendered response whose *\"checksum\"* \nmatches the one generated on the client, so that another client render is not needed, and more importantly so that another request to the server for\nan additional chunk is not needed.\n\nFor future imports performed on user navigation, the \"dual-import\" mechanism of `babel-plugin-universal-import` will request a stylesheet. To accomplish that, a hash of chunk names to stylsheets is provided so you can embed it in the page, similar to what webpack does with your js chunks in its bootstrap code.\n\nBefore we examine how to use `flushChunks/flushFiles`, let's take a look at the desired output. It's something like this:\n\n```html\n<head>\n  <link rel='stylesheet' href='/static/0.css' />\n  <link rel='stylesheet' href='/static/7.css' />\n  <link rel='stylesheet' href='/static/main.css' />\n</head> \n\n<body>\n  <div id=\"react-root\"></div>\n\n  <!-- before entry chunks -->\n  <script type='text/javascript' src='/static/bootstrap.js'></script>\n  <script type='text/javascript' src='/static/vendor.js'></script>\n\n  <!-- dynamic chunks -->\n  <script type='text/javascript' src='/static/0.js'></script>\n  <script type='text/javascript' src='/static/7.js'></script>\n\n  <!-- after entry chunks -->\n  <script type='text/javascript' src='/static/main.js'></script>\n</body>\n```\n\n> Notice common `vendor` and `bootstrap` chunks at the beginning and your main entry bundle (`main`) at the end. \nNotice that chunks `0` and `7` are served, but not chunks `1-6` or `8+`. That's a lot of bytes saved in initial requests!\n\nBecause of the way Webpack works where \"bootstrap\" code must be run before any additional chunks can be registered, \nit's imperative bootstrap and common chunks are generated and placed at the beginning, \nthereby allowing you to place dynamic chunks before your entry chunk which kickstarts app rendering.\n\nIn conjunction with your Webpack configuration (which we'll specify [below](#webpack-configuration)), *Webpack Flush Chunks* solves these problems for you by consuming your Webpack compilation `stats` and generating strings, arrays and components you can embed in the final output rendered on the server.\n\n*.babelrc:*\n```\n{\n  \"plugins\": [\"universal-import\"]\n}\n\n```\n\n*src/components/App.js:*\n```js\nimport universal from 'react-universal-component'\n\nconst UniversalComponent = universal(props => import(`./${props.page})\n\nexport default () =>\n  <div>\n    <UniversalComponent page='Foo' />\n  </div>\n```\n\n*server/render.js:*\n\n```js\nimport ReactDOMServer from 'react-dom/server'\nimport { flushChunkNames } from 'react-universal-component/server'\nimport flushChunks from 'webpack-flush-chunks'\n\nconst app = ReactDOMServer.renderToString(<App />)\nconst chunkNames = flushChunkNames()\nconst { js, styles } = flushChunks(stats, { chunkNames })\n\nres.send(`\n  <!doctype html>\n  <html>\n    <head>\n      ${styles}\n    </head>\n    <body>\n      <div id=\"root\">${app}</div>\n      ${js}\n    </body>\n  </html>\n`)\n```\n\n*et voila!*\n\n> Note: if you require a less automated approach where you're given just the stylesheets and scripts corresponding to dynamic chunks (e.g. not `main.js`), see `flushFiles` in the [the low-level API section](#low-level-api-flushfiles).\n\n## Options API:\n\n```js\nflushChunks(stats, {\n  chunkNames: ReactUniversalComponent.flushChunkNames(),\n  before: ['bootstrap', 'vendor'],                // default\n  after: ['main'],                                // default\n  outputPath: path.resolve(__dirname, '../dist'), // required only if you want to serve raw CSS\n})\n```\n\n- **chunkNames** - ***array of chunks flushed from `react-universal-component`\n\n- **before** - ***array of named entries that come BEFORE your dynamic chunks:*** ~~A typical \npattern is to create a `vendor` chunk. A better strategy is to create a `vendor` and a `bootstrap` chunk. The \"bootstrap\"\nchunk is a name provided to the `CommonsChunkPlugin` which has no entry point specified for it. The plugin by default removes \nwebpack bootstrap code from the named `vendor` common chunk and puts it in the `bootstrap` chunk. This is a common pattern because\nthe webpack bootstrap code has info about the chunks/modules used in your bundle and is likely to change, which means to cache\nyour `vendor` chunk you need to extract the bootstrap code into its own small chunk file. If this is new to you, don't worry.\n[Below](#webpack-configuration) you will find examples for exactly how to specify your Webpack config. Lastly, you do not need to provide this option if you have a `bootstrap` chunk, or `vendor` chunk or both, as those are the defaults.~~\n\nMostly related to Webpack 2 & 3. It is still very useful if you need to load a specific chunk name **first** `webpack-flush-chunks` now can rely on a better chunk graph provided by Webpack 4 - chunks are loaded in the correct order with more autonomy.\n\n- **after** - ***array of named entries that come AFTER your dynamic chunks:*** \n~~Similar to `before`, `after` contains an array of chunks you want to come after the dynamic chunks that\nyour universal component flushes. Typically you have just a `main` chunk, and if that's the case, you can ignore this option,\nas that's the default.~~\n\n- **outputPath** - ***absolute path to the directory containing your client build:*** This is only needed if serving css \nembedded in your served response HTML, rather than links to external stylesheets. I.e. if you are using the `Css` and `css` values in the `return API` described in the next section. It's needed to determine where in the file system to find the CSS that needs to be extract into\nan in-memory string. Keep in mind if you're rendering the server with Webpack, filesystem paths may not match up, so it's important\nto accurately pass the `outputPath` to your `serverRender` method. We recommend to do this by running your server \nexpress/koa/hapi/etc code via Babel and then by requiring your Webpack server bundle into it. \nSee [one of our boilerplates](#boilerplates) for an example.\n\n\n## Return API:\n\nThe return of `flushChunks` provides many options to render server side requests, giving you maximum flexibility:\n\n```js\nconst {\n  // react components:\n  Js,     // javascript chunks\n  Styles, // external stylesheets\n  Css,    // raw css\n\n  // strings:\n  js,     // javascript chunks\n  styles, // external stylesheets\n  css,    // raw css\n\n  // arrays of file names:\n  scripts,\n  stylesheets,\n\n  // cssHash for use with babel-plugin-dual-import\n  cssHashRaw, // hash object of chunk names to css file paths\n  cssHash,    // string: <script>window.__CSS_CHUNKS__ = ${JSON.stringify(cssHashRaw)}</script>\n  CssHash,    // react component of above\n\n  // important paths:\n  publicPath,\n  outputPath\n} = flushChunks(moduleIds, stats, options)\n```\n\nLet's take a look at some examples:\n\n\n\n\n\n## Webpack Configuration\n\n***client:***\n```js\nconst ExtractCssChunks = require('extract-css-chunks-webpack-plugin')\n\nentry: [\n  path.resolve(__dirname, '../src/index.js'),\n],\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      use: [\n       ExtractCssChunks.loader,\n       {\n        loader: 'css-loader',\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      ]\n    }\n  ]\n},\nplugins: [\n  new ExtractCssChunks(),                     \n  ...\n```\n\n\n***server:***\n```js\nmodule: {\n  rules: [\n    {\n      test: /\\.js$/,\n      exclude: /node_modules/,\n      use: 'babel-loader',\n    },\n    {\n      test: /\\.css$/,\n      exclude: /node_modules/,\n      use: {\n        loader: 'css-loader/locals',          // notice you're using the `locals` file as your loader\n        options: {\n          modules: true,\n          localIdentName: '[name]__[local]--[hash:base64:5]'\n        }\n      }\n    }\n  ]\n}\nplugins: [\n  new webpack.optimize.LimitChunkCountPlugin({\n    maxChunks: 1,                               \n  })\n  ...\n```\n\n- The `LimitChunkCountPlugin` with `maxChunks: 1` insures only one file is generated for your server bundle\nso it can be run synchronously.\n\n\n## Externals\nIf you're specifying externals to leave unbundled, you need to tell Webpack\nto still bundle `react-universal-component` and `webpack-flush-chunks` so that they know they are running within Webpack. For example:\n\n```js\nconst externals = fs\n  .readdirSync(modeModules)\n  .filter(x => !/\\.bin|react-universal-component|webpack-flush-chunks/.test(x))\n  .reduce((externals, mod) => {\n    externals[mod] = `commonjs ${mod}`\n    return externals\n  }, {})\n```\n\n## AutoDllPlugin\nSince the webpack plugin API does not yet allow you to add to stats, the [AutoDllPlugin cannot add chunks to stats](https://github.com/asfktz/autodll-webpack-plugin/issues/23). Therefore you have to embed its corresponding script manually. \n\n## Low-level API: `flushFiles`\n\nFor advanced users that want access to all files flushed (`.js`, `.css` or whatever else might be in there) and without named entry chunks you already know (such as `bootstrap`, `vendor`, and `main`), here you go:\n\n```js\nimport { flushChunkNames } from 'react-universal-component/server'\nimport { flushFiles } from 'webpack-flush-chunks'\n\nconst chunkNames = flushChunkNames()\nconst scripts = flushFiles(stats, { chunkNames, filter: 'js' })\nconst styles = flushFiles(stats, { chunkNames, filter: 'css' })\n```\n> i.e. this will get you all files corresponding to flushed \"dynamic\" chunks.\n\nThe only thing different with the API is that it has a `filter` option, and that it doesn't have `before`, `after` and `outputPath` options. The `filter` can be a file extension as a string, a regex, or a function: `filter: file => file.endsWith('js')`.\n\nKeep in mind, you will have to get right placing these between your `bootstrap` and `main` scripts. ***OR*** if you don't have a `bootstrap` script, you need to set it up so your `main` script doesn't actually call `ReactDOM.render`, and instead you put `<script>window.render()</script>` (where `window.render()` calls `ReactDOM.render`) after all your chunks in your markup so that by the time it's called all your chunks are loaded. In the latter case, you should put your dynamic chunks received from `flushFiles` **after** your `main` script so that the webpack bootstrap code *now within your `main` script* (as it regularly is) knows what to do with the additional scripts from dynamic chunks.\n\nIf what you want, instead of file names, is full-on compilation `chunk` objects (and any information it contains, which for 99% of most projects is unnecessary), create an issue and we'll add it. But until there is an actual need, we would like to keep the API simple.\n\n## Additional Docs\n- [How to get webpack stats](./docs/webpack-stats.md)\n- [using a babel server (not recommended)](./docs/babel-config.md)\n- [`flushModuleIds()` (legacy)](./docs/flush-module-ids.md)\n\n\n## Universal Demo\n🍾🍾🍾 **[faceyspacey/universal-demo](https://github.com/faceyspacey/universal-demo)** 🚀🚀🚀\n\n```bash\ngit clone https://github.com/faceyspacey/universal-demo.git\ncd universal-demo\nyarn\nyarn start\n```\n\n## Contributing\n\nWe use [commitizen](https://github.com/commitizen/cz-cli), so run `npm run cm` to make commits. A command-line form will appear, requiring you answer a few questions to automatically produce a nicely formatted commit. Releases, semantic version numbers, tags, changelogs and publishing to NPM will automatically be handled based on these commits thanks to [semantic-release](https://github.com/semantic-release/semantic-release). Be good.\n\n\n## Tests\n\nReviewing a package's tests are a great way to get familiar with it. It's direct insight into the capabilities of the given package (if the tests are thorough). What's even better is a screenshot of the tests neatly organized and grouped (you know the whole \"a picture says a thousand words\" thing). \n\nBelow is a screenshot of this module's tests running in [Wallaby](https://wallabyjs.com) *(\"An Integrated Continuous Testing Tool for JavaScript\")* which everyone in the React community should be using. It's fantastic and has taken my entire workflow to the next level. It re-runs your tests on every change along with comprehensive logging, bi-directional linking to your IDE, in-line code coverage indicators, **and even snapshot comparisons + updates for Jest!** I requestsed that feature by the way :). It's basically a substitute for live-coding that inspires you to test along your journey.\n\n![webpack-flush-chunks wallaby tests screenshot](./tests-screenshot.png)\n\n## More from FaceySpacey in Reactlandia\n- [redux-first-router](https://github.com/faceyspacey/redux-first-router). It's made to work perfectly with *Universal*. Together they comprise our *\"frameworkless\"* Redux-based approach to what Next.js does (splitting, SSR, prefetching, and routing). *People are lovin it by the way* 😎\n","maintainers":[{"email":"james@faceyspacey.com","name":"faceyspacey"},{"email":"zackary.l.jackson@gmail.com","name":"zackljackson"}],"time":{"modified":"2022-06-28T23:53:00.950Z","created":"2017-04-26T11:53:01.419Z","0.0.1":"2017-04-26T11:53:01.419Z","0.0.2":"2017-04-27T11:20:12.807Z","0.0.3":"2017-04-27T14:37:09.127Z","0.1.0":"2017-04-29T11:24:45.564Z","0.1.1":"2017-05-07T09:12:59.172Z","0.2.0":"2017-06-07T03:58:49.021Z","0.2.1":"2017-06-07T09:33:35.158Z","0.2.2":"2017-06-07T21:22:27.152Z","1.0.0":"2017-06-08T08:13:38.987Z","1.0.1":"2017-06-08T09:02:07.351Z","1.0.2":"2017-06-08T09:25:51.245Z","1.0.3":"2017-06-08T09:41:45.265Z","1.0.4":"2017-06-08T10:55:57.372Z","1.0.5":"2017-06-08T12:00:30.077Z","1.0.6":"2017-06-08T12:02:40.837Z","1.0.7":"2017-06-08T13:56:31.419Z","1.0.8":"2017-06-08T13:58:27.457Z","1.0.9":"2017-06-08T16:00:05.263Z","1.0.10":"2017-06-11T01:48:25.820Z","1.1.0":"2017-07-04T21:46:09.900Z","1.1.1":"2017-07-04T21:58:11.870Z","1.1.2":"2017-07-04T22:02:46.507Z","1.1.3":"2017-07-07T13:42:37.154Z","1.1.4":"2017-07-07T13:43:15.635Z","1.1.5":"2017-07-07T13:46:14.758Z","1.1.6":"2017-07-07T13:48:18.510Z","1.1.7":"2017-07-07T13:50:48.612Z","1.1.8":"2017-07-07T13:51:47.574Z","1.1.9":"2017-07-07T13:55:14.582Z","1.1.10":"2017-07-07T13:56:25.632Z","1.1.11":"2017-07-27T05:22:18.849Z","1.1.12":"2017-07-27T13:42:29.813Z","1.1.13":"2017-07-27T14:37:00.922Z","1.1.14":"2017-07-27T14:37:11.180Z","1.1.15":"2017-07-28T19:57:59.253Z","1.1.16":"2017-07-28T20:31:54.178Z","1.1.17":"2017-07-31T10:41:32.431Z","1.1.18":"2017-08-04T14:03:12.155Z","1.1.19":"2017-08-12T09:54:54.935Z","1.1.20":"2017-08-12T09:57:56.791Z","1.1.21":"2017-08-14T07:49:10.843Z","1.1.22":"2017-08-14T16:52:03.845Z","1.1.23":"2017-08-18T14:30:36.564Z","1.2.0":"2017-10-12T01:18:06.584Z","1.2.1":"2017-11-01T10:14:57.759Z","1.2.2":"2017-11-20T18:06:42.390Z","1.2.3":"2017-12-20T10:44:09.086Z","1.3.0-beta.0":"2018-06-11T02:00:50.838Z","2.0.0-beta.0":"2018-06-12T00:19:17.943Z","2.0.0-beta.1":"2018-06-12T00:22:01.271Z","2.0.0-beta.2":"2018-06-12T03:26:30.683Z","2.0.0-beta.3":"2018-06-12T03:54:07.987Z","2.0.0":"2018-06-12T20:00:18.629Z","2.0.1-beta.1":"2018-06-22T03:11:21.787Z","2.0.1":"2018-06-23T03:46:39.701Z","0.0.0-placeholder":"2018-09-17T17:54:30.434Z","3.0.0-alpha.0":"2018-09-17T17:55:14.215Z","3.0.0-alpha.1":"2018-09-18T20:52:07.652Z","2.0.2":"2018-10-01T15:44:06.568Z","3.0.0-alpha.2":"2018-10-01T15:46:32.920Z","3.0.0-alpha.3":"2018-10-02T03:45:43.998Z","3.0.0-alpha.4":"2018-10-02T04:21:34.285Z","2.0.3":"2018-10-02T14:27:33.471Z"},"homepage":"https://github.com/faceyspacey/webpack-flush-chunks#readme","repository":{"type":"git","url":"git+https://github.com/faceyspacey/webpack-flush-chunks.git"},"author":{"name":"James Gillmore","email":"james@faceyspacey.com"},"bugs":{"url":"https://github.com/faceyspacey/webpack-flush-chunks/issues"},"license":"MIT","readmeFilename":"README.md","users":{"derrickbeining":true,"uaaoe":true},"contributors":[{"name":"Zack Jackson","email":"zackary.l.jackson@gmail.com"}]}