TouchInstinct
/
html-webpack-plugin
301
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor asset helper to support .css (extract-text-webpack-plugin) and .manifest (appcache-webpack-plugin) files 

Unfortunately this breaks the old template structure
This commit is contained in:
Jan Nicklas 2015-03-11 10:48:52 +01:00
parent 5693285436
commit f88225fe3e
2 changed files with 36 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
default_index.html
View File

@ -1,12 +1,15 @@
<!DOCTYPE html>
<html>
<html{% if(o.htmlWebpackPlugin.assets.manifest) { %} manifest="{%= o.htmlWebpackPlugin.assets.manifest %}"{% } %}>
<head>
<meta charset="UTF-8">
<title>{%=o.htmlWebpackPlugin.options.title || 'Webpack App'%}</title>
{% for (var css in o.htmlWebpackPlugin.assets.css) { %}
<link href="{%=o.htmlWebpackPlugin.assets.css[css]%}" rel="stylesheet">
{% } %}
</head>
<body>
{% for (var chunk in o.htmlWebpackPlugin.assets) { %}
<script src="{%=o.htmlWebpackPlugin.assets[chunk]%}"></script>
{% for (var chunk in o.htmlWebpackPlugin.assets.chunks) { %}
<script src="{%=o.htmlWebpackPlugin.assets.chunks[chunk].entry%}"></script>
{% } %}
</body>
</html>

40
index.js
View File

@ -57,20 +57,40 @@ HtmlWebpackPlugin.prototype.emitHtml = function(compiler, htmlTemplateContent, t
HtmlWebpackPlugin.prototype.htmlWebpackPluginAssets = function(compilation, webpackStatsJson) {
var assets = {};
var assets = {
// Will contain all js & css files by chunk
chunks: [],
// Will contain all js files
js: [],
// Will contain all css files
css: [],
// Will contain the html5 appcache manifest files if it exists
manifest: Object.keys(compilation.assets).filter(function(assetFile){
return path.extname(assetFile) === '.appcache';
})[0]
};
var publicPath = compilation.options.output.publicPath || '';
for (var chunk in webpackStatsJson.assetsByChunkName) {
var chunkValue = webpackStatsJson.assetsByChunkName[chunk];
assets.chunks[chunk] = {};
// Prepend the public path to all chunk files
var chunkFiles = [].concat(webpackStatsJson.assetsByChunkName[chunk]).map(function(chunkFile) {
return publicPath + chunkFile;
});
// Webpack outputs an array for each chunk when using sourcemaps
if (chunkValue instanceof Array) {
// Is the main bundle always the first element?
chunkValue = chunkValue[0];
}
// But we need only the entry file
var entry = chunkFiles[0];
assets.chunks[chunk].entry = entry;
assets.js.push(entry);
if (compilation.options.output.publicPath) {
chunkValue = compilation.options.output.publicPath + chunkValue;
}
assets[chunk] = chunkValue;
// Gather all css files
var css = chunkFiles.filter(function(chunkFile){
return path.extname(chunkFile) === '.css';
});
assets.chunks[chunk].css = css;
assets.css = assets.css.concat(css);
}
return assets;