diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 683e5503bc3..3d6d467c645 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -26,7 +26,7 @@
},
"devDependencies": {
"copy-webpack-plugin": "^4.5.3",
- "html-webpack-plugin": "^3.2.0",
+ "html-webpack-plugin": "^4.0.0-beta.1",
"webpack-dev-server": "^3.1.9"
}
}
diff --git a/lib/cli/test/fixtures/sfc_vue/package.json b/lib/cli/test/fixtures/sfc_vue/package.json
index f40d25cbbbc..55f7869b5fd 100644
--- a/lib/cli/test/fixtures/sfc_vue/package.json
+++ b/lib/cli/test/fixtures/sfc_vue/package.json
@@ -31,7 +31,7 @@
"extract-text-webpack-plugin": "^2.0.0",
"file-loader": "^0.11.1",
"friendly-errors-webpack-plugin": "^1.1.3",
- "html-webpack-plugin": "^2.28.0",
+ "html-webpack-plugin": "^4.0.0-beta.1",
"http-proxy-middleware": "^0.17.3",
"opn": "^5.1.0",
"optimize-css-assets-webpack-plugin": "^2.0.0",
diff --git a/lib/core/package.json b/lib/core/package.json
index 3851b4b97af..ede16c99724 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -51,8 +51,8 @@
"express": "^4.16.3",
"file-loader": "^2.0.0",
"find-cache-dir": "^2.0.0",
- "generate-page-webpack-plugin": "^1.1.1",
"global": "^4.3.2",
+ "html-webpack-plugin": "^4.0.0-beta.1",
"inquirer": "^6.2.0",
"interpret": "^1.1.0",
"ip": "^1.1.5",
diff --git a/lib/core/src/server/config/webpack.config.dev.js b/lib/core/src/server/config/webpack.config.dev.js
index 4b320bc5526..3edaa764915 100644
--- a/lib/core/src/server/config/webpack.config.dev.js
+++ b/lib/core/src/server/config/webpack.config.dev.js
@@ -4,7 +4,9 @@ import { getEnvironment } from 'universal-dotenv';
import Dotenv from 'dotenv-webpack';
import WatchMissingNodeModulesPlugin from 'react-dev-utils/WatchMissingNodeModulesPlugin';
import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
-import GeneratePagePlugin from 'generate-page-webpack-plugin';
+
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+
import {
includePaths,
excludePaths,
@@ -42,20 +44,24 @@ export default ({ configDir, quiet, babelOptions, entries }) => {
publicPath: '',
},
plugins: [
- new GeneratePagePlugin(
- {
- template: require.resolve('../templates/index.html.ejs'),
- // eslint-disable-next-line global-require
- parser: require('ejs'),
- filename: entry => (entry === 'manager' ? 'index' : entry),
- },
- {
- data: { version },
- headHtmlSnippet: entry =>
- entriesMeta[entry] ? entriesMeta[entry].headHtmlSnippet : null,
- bodyHtmlSnippet: entry =>
- entriesMeta[entry] ? entriesMeta[entry].bodyHtmlSnippet : null,
- }
+ ...Object.keys(entries).map(
+ e =>
+ new HtmlWebpackPlugin({
+ filename: `${e === 'manager' ? 'index' : e}.html`,
+ excludeChunks: Object.keys(entries).filter(i => i !== e),
+ chunksSortMode: 'none',
+ alwaysWriteToDisk: true,
+ inject: false,
+ templateParameters: (compilation, files, options) =>
+ console.log({ options, files }) || {
+ compilation,
+ files,
+ options,
+ version,
+ ...entriesMeta[e],
+ },
+ template: require.resolve(`../templates/index.ejs`),
+ })
),
new webpack.DefinePlugin(loadEnv()),
new webpack.HotModuleReplacementPlugin(),
diff --git a/lib/core/src/server/templates/index.ejs b/lib/core/src/server/templates/index.ejs
new file mode 100644
index 00000000000..cb0822c14f9
--- /dev/null
+++ b/lib/core/src/server/templates/index.ejs
@@ -0,0 +1,46 @@
+
+
+
+
+
+ <%= options.title || 'Storybook'%>
+
+ <% if (files.favicon) { %>
+
+ <% } %>
+
+ <% if (options.mobile) { %>
+
+ <% } %>
+
+ <% if (typeof headHtmlSnippet !== 'undefined') { %>
+ <%= headHtmlSnippet %>
+ <% } %>
+
+ <% files.css.forEach(file => { %>
+
+ <% }); %>
+
+
+
+
+<% if (typeof bodyHtmlSnippet !== 'undefined') { %>
+ <%= bodyHtmlSnippet %>
+<% } %>
+
+
+
+<% if (options.window) { %>
+
+<% } %>
+
+<% files.js.forEach(file => { %>
+
+<% }); %>
+
+
+
diff --git a/lib/core/src/server/templates/index.html.ejs b/lib/core/src/server/templates/index.html.ejs
deleted file mode 100644
index c775b7c7288..00000000000
--- a/lib/core/src/server/templates/index.html.ejs
+++ /dev/null
@@ -1,62 +0,0 @@
-
-
-
-
-
-
- Storybook
-
-
- <% if (options.headHtmlSnippet) { %>
- <%- options.headHtmlSnippet %>
- <% } %>
-
- <% if (options.links) { %>
- <% for (item of options.links) { %>
- <% if (typeof item === 'string' || item instanceof String) { item = { href: item, rel: 'stylesheet' } } %>
- <%= key %>="<%= item[key] %>"<% } %>>
- <% } %>
- <% } %>
-
- <% for (item of files) { %>
- <% if (item.match(/.css$/)) { %>
-
- <% } %>
- <% } %>
-
-
-
-
- <% if (options.window) { %>
-
- <% } %>
-
- <% if (options.bodyHtmlSnippet) { %>
- <%- options.bodyHtmlSnippet %>
- <% } %>
-
-
-
- <% if (options.scripts) { %>
- <% for (item of options.scripts) { %>
- <% if (typeof item === 'string' || item instanceof String) { item = { src: item } } %>
-
- <% } %>
- <% } %>
-
- <% for (key in dlls) { %>
-
- <% } %>
-
- <% for (item of files) { %>
- <% if (item.match(/.js$/)) { %>
-
- <% } %>
- <% } %>
-
-
-
diff --git a/yarn.lock b/yarn.lock
index 82f802e747b..65b0ce8bdff 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1980,6 +1980,13 @@
call-me-maybe "^1.0.1"
glob-to-regexp "^0.3.0"
+"@ndelangen/html-webpack-harddisk-plugin@^0.2.0":
+ version "0.2.0"
+ resolved "https://registry.yarnpkg.com/@ndelangen/html-webpack-harddisk-plugin/-/html-webpack-harddisk-plugin-0.2.0.tgz#d2eb570597c83c1aa93d1f2fcb3d874a5855de07"
+ integrity sha512-55Mo2b5WtIT0l653y6ocu7C6QzznbasEnlixGzA26WK8Fj81wuEY3xf5N5bNAvDVfrwTLIPTXdEUGgPdrPLszw==
+ dependencies:
+ mkdirp "^0.5.1"
+
"@ngrx/store@^6.1.0":
version "6.1.0"
resolved "https://registry.yarnpkg.com/@ngrx/store/-/store-6.1.0.tgz#5b027647a797bf027912568214b10375dd75af38"
@@ -11348,7 +11355,7 @@ html-webpack-plugin@4.0.0-alpha.2:
tapable "^1.0.0"
util.promisify "1.0.0"
-html-webpack-plugin@^3.0.6, html-webpack-plugin@^3.2.0:
+html-webpack-plugin@^3.0.6:
version "3.2.0"
resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-3.2.0.tgz#b01abbd723acaaa7b37b6af4492ebda03d9dd37b"
integrity sha1-sBq71yOsqqeze2r0SS69oD2d03s=
@@ -11361,6 +11368,19 @@ html-webpack-plugin@^3.0.6, html-webpack-plugin@^3.2.0:
toposort "^1.0.0"
util.promisify "1.0.0"
+html-webpack-plugin@^4.0.0-beta.1:
+ version "4.0.0-beta.1"
+ resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-4.0.0-beta.1.tgz#15b3b3634af47c79ac46c185f64e2007e0b0d14c"
+ integrity sha512-O+stuSCY5rdzX5O1l1FdH1bZqRQ7ybTi12OHzgD8u5Ogu2Usu3K7e633vxj4uOjM49ST+qCcu5rWYhqNKlpomQ==
+ dependencies:
+ "@types/tapable" "1.0.2"
+ html-minifier "^3.2.3"
+ loader-utils "^1.1.0"
+ lodash "^4.17.10"
+ pretty-error "^2.0.2"
+ tapable "^1.0.0"
+ util.promisify "1.0.0"
+
htmlescape@^1.1.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/htmlescape/-/htmlescape-1.1.1.tgz#3a03edc2214bca3b66424a3e7959349509cb0351"