├── .gitignore ├── HISTORY.md ├── LICENSE.md ├── README.md ├── lib └── ChunkManifestPlugin.js ├── package-lock.json └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | -------------------------------------------------------------------------------- /HISTORY.md: -------------------------------------------------------------------------------- 1 | 1.1.0 / 2017-04-21 2 | ================== 3 | 4 | - Adds `options.inlineManifest` for users who implement html-webpack-plugin ([#18](https://github.com/soundcloud/chunk-manifest-webpack-plugin/pull/18)) 5 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | Copyright (c) 2014 Jason Anderson 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy 4 | of this software and associated documentation files (the "Software"), to deal 5 | in the Software without restriction, including without limitation the rights 6 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 7 | copies of the Software, and to permit persons to whom the Software is 8 | furnished to do so, subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in 11 | all copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 19 | THE SOFTWARE. 20 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # chunk-manifest-webpack-plugin 2 | 3 | Allows exporting a JSON file that maps chunk ids to their resulting asset files. Webpack can then read this mapping, assuming it is provided somehow on the client, instead of storing a mapping (with chunk asset hashes) in the bootstrap script, which allows to actually leverage long-term caching. 4 | 5 | ## Usage 6 | 7 | Install via npm: 8 | 9 | ```shell 10 | npm install --save-dev chunk-manifest-webpack-plugin 11 | ``` 12 | 13 | Install via yarn: 14 | 15 | ```shell 16 | yarn add --dev chunk-manifest-webpack-plugin 17 | ``` 18 | 19 | And then require and provide to webpack: 20 | 21 | ```javascript 22 | // in webpack.config.js or similar 23 | const ChunkManifestPlugin = require('chunk-manifest-webpack-plugin'); 24 | 25 | module.exports = { 26 | // your config values here 27 | plugins: [ 28 | new ChunkManifestPlugin({ 29 | filename: 'manifest.json', 30 | manifestVariable: 'webpackManifest', 31 | inlineManifest: false 32 | }) 33 | ] 34 | }; 35 | ``` 36 | 37 | ### Options 38 | 39 | #### `filename` 40 | 41 | Where the manifest will be exported to on bundle compilation. This will be relative to the main webpack output directory. Default = `"manifest.json"` 42 | 43 | #### `manifestVariable` 44 | 45 | What JS variable on the client webpack should refer to when requiring chunks. Default = `"webpackManifest"` 46 | 47 | #### `inlineManifest` 48 | 49 | Whether or not to write the manifest output into the [html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin). Default = `false` 50 | 51 | ```html 52 | // index.ejs 53 | 54 | 55 | <%= htmlWebpackPlugin.files.webpackManifest %> 56 | 57 | ``` -------------------------------------------------------------------------------- /lib/ChunkManifestPlugin.js: -------------------------------------------------------------------------------- 1 | var RawSource = require("webpack-core/lib/RawSource"); 2 | 3 | function ChunkManifestPlugin(options) { 4 | options = options || {}; 5 | this.manifestFilename = options.filename || "manifest.json"; 6 | this.manifestVariable = options.manifestVariable || "webpackManifest"; 7 | this.inlineManifest = options.inlineManifest || false; 8 | } 9 | module.exports = ChunkManifestPlugin; 10 | 11 | ChunkManifestPlugin.prototype.constructor = ChunkManifestPlugin; 12 | ChunkManifestPlugin.prototype.apply = function(compiler) { 13 | var manifestFilename = this.manifestFilename; 14 | var manifestVariable = this.manifestVariable; 15 | var inlineManifest = this.inlineManifest; 16 | var oldChunkFilename; 17 | var chunkManifest; 18 | 19 | compiler.plugin("this-compilation", function(compilation) { 20 | var mainTemplate = compilation.mainTemplate; 21 | mainTemplate.plugin("require-ensure", function(_, chunk, hash) { 22 | var filename = this.outputOptions.chunkFilename || this.outputOptions.filename; 23 | 24 | if (filename) { 25 | chunkManifest = [chunk].reduce(function registerChunk(manifest, c) { 26 | if(c.id in manifest) return manifest; 27 | var hasRuntime = typeof c.hasRuntime === 'function' ? c.hasRuntime() : c.entry; 28 | if(hasRuntime) { 29 | manifest[c.id] = undefined; 30 | } else { 31 | manifest[c.id] = mainTemplate.applyPluginsWaterfall("asset-path", filename, { 32 | hash: hash, 33 | chunk: c 34 | }); 35 | } 36 | return c.chunks.reduce(registerChunk, manifest); 37 | }, {}); 38 | oldChunkFilename = this.outputOptions.chunkFilename; 39 | this.outputOptions.chunkFilename = "__CHUNK_MANIFEST__"; 40 | // mark as asset for emitting 41 | compilation.assets[manifestFilename] = new RawSource(JSON.stringify(chunkManifest)); 42 | chunk.files.push(manifestFilename); 43 | } 44 | 45 | return _; 46 | }); 47 | }); 48 | 49 | compiler.plugin("compilation", function(compilation) { 50 | compilation.mainTemplate.plugin("require-ensure", function(_, chunk, hash, chunkIdVar) { 51 | if (oldChunkFilename) { 52 | this.outputOptions.chunkFilename = oldChunkFilename; 53 | } 54 | 55 | return _.replace("\"__CHUNK_MANIFEST__\"", 56 | "window[\"" + manifestVariable + "\"][" + chunkIdVar + "]"); 57 | }); 58 | 59 | if (inlineManifest){ 60 | compilation.plugin("html-webpack-plugin-before-html-generation", function (data, callback) { 61 | var manifestHtml = ""; 62 | callback(null, data.assets[manifestVariable] = manifestHtml); 63 | }); 64 | } 65 | }); 66 | }; 67 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chunk-manifest-webpack-plugin", 3 | "version": "1.1.2", 4 | "description": "Allows exporting a manifest that maps chunk ids to their output files, instead of keeping the mapping inside the webpack bootstrap.", 5 | "main": "lib/ChunkManifestPlugin.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "author": "Jason Anderson (http://diurnal.st)", 10 | "license": "MIT", 11 | "dependencies": { 12 | "webpack-core": "^0.6.9" 13 | }, 14 | "peerDependencies": { 15 | "webpack": "^2.0.0 || ^3.0.0" 16 | }, 17 | "repository": { 18 | "type": "git", 19 | "url": "git+https://github.com/soundcloud/chunk-manifest-webpack-plugin.git" 20 | }, 21 | "bugs": { 22 | "url": "https://github.com/soundcloud/chunk-manifest-webpack-plugin/issues" 23 | }, 24 | "homepage": "https://github.com/soundcloud/chunk-manifest-webpack-plugin#readme", 25 | "devDependencies": {}, 26 | "keywords": [ 27 | "webpack", 28 | "chunk", 29 | "manifest", 30 | "plugin" 31 | ] 32 | } 33 | --------------------------------------------------------------------------------