This repository has been archived by the owner on May 15, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 48
/
webpack.config.js
120 lines (115 loc) · 3.93 KB
/
webpack.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
/**
* Copyright 2018 Google Inc. All Rights Reserved.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
const path = require('path');
const webpack = require('webpack');
const InlineChunkWebpackPlugin = require('html-webpack-inline-chunk-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin');
const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
const isProduction = process.env.NODE_ENV === 'production';
console.log(
`Running webpack in the ${isProduction ? 'production' : 'development'} mode`,
);
module.exports = {
entry: {
app: './src/app.js',
landing: './src/landing.js',
},
output: {
path: path.resolve(__dirname, 'public', 'build'),
filename: isProduction ? '[name].[chunkhash].js' : '[name].js',
publicPath: '/build/',
},
module: {
rules: [
{
test: /\.js$/,
loader: 'babel-loader',
// Babel options are loaded from .babelrc
},
{
test: /\.css$/,
use: ['style-loader', 'css-loader'],
},
{
test: /\.svg$/,
loader: 'svg-url-loader',
options: {
// Inline files smaller than 10 kB (10240 bytes)
limit: 10 * 1024,
// Remove the quotes from the url (they’re unnecessary in our case)
noquotes: true,
},
},
{
test: /\.(jpe?g|png|gif|svg)$/,
loader: 'image-webpack-loader',
// This will apply the loader before the other ones
enforce: 'pre',
},
],
},
devtool: isProduction ? 'source-map' : 'cheap-module-source-map',
plugins: [
// Emit HTML files that serve the app
new HtmlWebpackPlugin({
template: 'src/templates/landing.html',
chunks: ['landing', 'vendor', 'runtime'],
filename: path.resolve(__dirname, 'public/index.html'),
alwaysWriteToDisk: true,
}),
new HtmlWebpackPlugin({
template: 'src/templates/app.html',
chunks: ['app', 'vendor', 'runtime'],
filename: path.resolve(__dirname, 'public/users/index.html'),
alwaysWriteToDisk: true,
}),
].concat(
isProduction
? [
// Minimize the app code
new webpack.optimize.UglifyJsPlugin(),
// Replace `process.env.NODE_ENV` with `"production"`
new webpack.DefinePlugin({
'process.env.NODE_ENV': '"production"',
}),
// Remove all Moment.js’ locales expect the English one
new MomentLocalesPlugin(),
// Concatenate modules where possible
new webpack.optimize.ModuleConcatenationPlugin(),
// Extract the vendor code
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: module =>
module.context && module.context.includes('node_modules'),
}),
// Extract the webpack’s runtime
new webpack.optimize.CommonsChunkPlugin({
name: 'runtime',
minChunks: Infinity,
}),
// Inline the webpack’s runtime
new InlineChunkWebpackPlugin({
inlineChunks: ['runtime'],
}),
]
: [
// Force writing the HTML files to disk when running in the development mode
// (otherwise, webpack-dev-server won’t serve the app)
new HtmlWebpackHarddiskPlugin(),
],
),
devServer: {
contentBase: path.join(__dirname, 'public'),
},
};