From d9d3b23c5613349cc599f3356b99a8599cd00e34 Mon Sep 17 00:00:00 2001 From: Charles Blaxland Date: Tue, 12 Aug 2014 13:01:56 +1000 Subject: [PATCH] Generate a default index.html from a single webpack entry point --- .gitignore | 27 ++------------------------- default_index.html | 10 ++++++++++ index.js | 30 ++++++++++++++++++++++++++++++ package.json | 33 +++++++++++++++++++++++++++++++++ spec/HtmlWebpackPluginSpec.js | 26 ++++++++++++++++++++++++++ spec/fixtures/index.js | 1 + 6 files changed, 102 insertions(+), 25 deletions(-) create mode 100644 default_index.html create mode 100644 index.js create mode 100644 package.json create mode 100644 spec/HtmlWebpackPluginSpec.js create mode 100644 spec/fixtures/index.js diff --git a/.gitignore b/.gitignore index da23d0d..b0a5c34 100644 --- a/.gitignore +++ b/.gitignore @@ -1,25 +1,2 @@ -# Logs -logs -*.log - -# Runtime data -pids -*.pid -*.seed - -# Directory for instrumented libs generated by jscoverage/JSCover -lib-cov - -# Coverage directory used by tools like istanbul -coverage - -# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) -.grunt - -# Compiled binary addons (http://nodejs.org/api/addons.html) -build/Release - -# Dependency directory -# Deployed apps should consider commenting this line out: -# see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git -node_modules +/node_modules/ +/dist/ diff --git a/default_index.html b/default_index.html new file mode 100644 index 0000000..51fec39 --- /dev/null +++ b/default_index.html @@ -0,0 +1,10 @@ + + + + + React Starter + + + + + diff --git a/index.js b/index.js new file mode 100644 index 0000000..f41cdb7 --- /dev/null +++ b/index.js @@ -0,0 +1,30 @@ +var fs = require('fs'); +var path = require('path'); +var tmpl = require('blueimp-tmpl').tmpl; + +function HtmlWebpackPlugin() { +} + +HtmlWebpackPlugin.prototype.htmlWebpackPluginJson = function(webpackStatsJson) { + json = {}; + json.assets = {}; + for (var chunk in webpackStatsJson.assetsByChunkName) { + json.assets[chunk] = webpackStatsJson.assetsByChunkName[chunk]; + } + return json; +}; + +HtmlWebpackPlugin.prototype.apply = function(compiler) { + var self = this; + compiler.plugin('done', function(stats) { + var webpackStatsJson = stats.toJson(); + var templateParams = {}; + templateParams.webpack = webpackStatsJson; + templateParams.htmlWebpackPlugin = self.htmlWebpackPluginJson(webpackStatsJson); + + var htmlTemplate = fs.readFileSync(path.join(__dirname, 'default_index.html'), 'utf8'); + fs.writeFileSync(path.join(compiler.options.output.path, 'index.html'), tmpl(htmlTemplate, templateParams)); + }); +}; + +module.exports = HtmlWebpackPlugin; diff --git a/package.json b/package.json new file mode 100644 index 0000000..3ee2e6e --- /dev/null +++ b/package.json @@ -0,0 +1,33 @@ +{ + "name": "html-webpack-plugin", + "version": "0.0.0", + "description": "Generates HTML files to serve your webpack bundles", + "main": "index.js", + "scripts": { + "test": "node_modules/.bin/jshint *.js spec && node_modules/.bin/jasmine-node --captureExceptions spec" + }, + "repository": { + "type": "git", + "url": "https://github.com/ampedandwired/html-webpack-plugin.git" + }, + "keywords": [ + "webpack", + "plugin", + "html", + "generate" + ], + "author": "Charles Blaxland (https://github.com/ampedandwired)", + "license": "MIT", + "bugs": { + "url": "https://github.com/ampedandwired/html-webpack-plugin/issues" + }, + "homepage": "https://github.com/ampedandwired/html-webpack-plugin", + "devDependencies": { + "jasmine-node": "^1.14.5", + "jshint": "^2.5.2", + "webpack": "^1.3.3-beta1" + }, + "dependencies": { + "blueimp-tmpl": "^2.5.4" + } +} diff --git a/spec/HtmlWebpackPluginSpec.js b/spec/HtmlWebpackPluginSpec.js new file mode 100644 index 0000000..2d2f89e --- /dev/null +++ b/spec/HtmlWebpackPluginSpec.js @@ -0,0 +1,26 @@ +var path = require('path'); +var fs = require('fs'); +var webpack = require('webpack'); + +var HtmlWebpackPlugin = require('../index.js'); + +describe('HtmlWebpackPlugin', function() { + it('generates a default index.html file for a single entry point', function(done) { + var outputDir = path.join(__dirname, '..', 'dist'); + var outputHtmlFile = path.join(outputDir, 'index.html'); + + webpack({ + entry: path.join(__dirname, 'fixtures', 'index.js'), + output: { + path: outputDir, + filename: 'index_bundle.js' + }, + plugins: [new HtmlWebpackPlugin()] + }, function(err, stats) { + expect(err).toBeFalsy(); + expect(stats.hasErrors()).toBe(false); + expect(fs.readFileSync(outputHtmlFile).toString()).toContain('