Examples: use html-webpack-plugin

This commit is contained in:
Laurentiu Nicola 2018-09-11 08:42:22 +03:00
parent 8ffa24bfe5
commit 89005f3469
41 changed files with 116 additions and 42 deletions

View File

@ -1,8 +0,0 @@
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
</head>
<body>
<script src='./index.js'></script>
</body>
</html>

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,8 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin()
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.8.3", "webpack": "^4.8.3",
"webpack-cli": "^2.1.3", "webpack-cli": "^2.1.3",
"webpack-dev-server": "^3.1.4" "webpack-dev-server": "^3.1.4"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.8.1", "webpack": "^4.8.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,6 +7,11 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development', mode: 'development',
devtool: 'source-map', devtool: 'source-map',
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -1,10 +0,0 @@
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
</head>
<body>
<script src='./index.js'></script>
</body>
</html>

View File

@ -3,6 +3,7 @@
"serve": "webpack-serve ./webpack.config.js" "serve": "webpack-serve ./webpack.config.js"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.16.5", "webpack": "^4.16.5",
"webpack-serve": "^2.0.2" "webpack-serve": "^2.0.2"
} }

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,8 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin()
],
mode: 'development' mode: 'development'
}; };

View File

@ -1,8 +0,0 @@
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
</head>
<body>
<script src='./index.js'></script>
</body>
</html>

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,8 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin()
],
mode: 'development' mode: 'development'
}; };

View File

@ -1,8 +0,0 @@
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
</head>
<body>
<script src='./index.js'></script>
</body>
</html>

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,8 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin()
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.0.1", "webpack": "^4.0.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,6 +7,11 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development', mode: 'development',
devServer: { devServer: {
open: true open: true

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -1,8 +0,0 @@
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
</head>
<body>
<script src='./index.js'></script>
</body>
</html>

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,8 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin()
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.11.1", "webpack": "^4.11.1",
"webpack-cli": "^2.0.10", "webpack-cli": "^2.0.10",
"webpack-dev-server": "^3.1.0" "webpack-dev-server": "^3.1.0"

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };

View File

@ -3,6 +3,7 @@
"serve": "webpack-dev-server" "serve": "webpack-dev-server"
}, },
"devDependencies": { "devDependencies": {
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.16.5", "webpack": "^4.16.5",
"webpack-serve": "^2.0.2" "webpack-serve": "^2.0.2"
} }

View File

@ -1,4 +1,5 @@
const path = require('path'); const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = { module.exports = {
entry: './index.js', entry: './index.js',
@ -6,5 +7,10 @@ module.exports = {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'index.js', filename: 'index.js',
}, },
plugins: [
new HtmlWebpackPlugin({
template: "index.html"
})
],
mode: 'development' mode: 'development'
}; };