-
Notifications
You must be signed in to change notification settings - Fork 1
/
webpack.config.js
109 lines (105 loc) · 2.73 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
const path = require('path');
const webpack = require('webpack');
const HtmlPlugin = require('html-webpack-plugin');
const ScriptExtHtmlPlugin = require('script-ext-html-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const OptimizeCSSAssets = require("optimize-css-assets-webpack-plugin");
const SOURCE_ROOT = path.join(__dirname, 'src/Svelte');
const DISTRIBUTION_ROOT = path.join(__dirname, 'public/js');
const prod = process.env.BUILD_MODE === 'prod'
module.exports = () => ({
mode: prod ? 'production' : 'development',
context: SOURCE_ROOT,
entry: './main.js',
output: {
path: DISTRIBUTION_ROOT,
filename: prod ? '[name].[hash].js' : '[name].js',
chunkFilename: prod ? '[id].[chunkhash].js' : '[name].js',
publicPath: '/js',
},
module: {
rules: [
{
test: /\.svelte$/,
loader: 'svelte-loader',
options: {
dev: !prod,
emitCss: true,
preprocess: require('svelte-preprocess')({
stylus: false,
typescript: false,
pug: false,
coffeescript: false,
less: false,
postcss: false
})
}
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.css$/,
use: [
{ loader: MiniCssExtractPlugin.loader },
{ loader: 'css-loader', options: { importLoaders: 1 } },
].filter(Boolean),
},
].filter(Boolean),
},
resolve: {
extensions: ['.mjs', '.js', '.svelte'],
alias: {
'~': SOURCE_ROOT,
},
},
plugins: [
new HtmlPlugin({
templateContent: ' ',
minify: prod && {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true,
},
inject: 'head',
chunksSortMode: prod ? 'manual' : 'auto',
filename: '../../templates/svelte-inject.html'
}),
new ScriptExtHtmlPlugin({
defaultAttribute: 'defer',
sync: {
test: /\.css$/,
},
preload: {
test: /\.js$/,
chunks: 'initial',
},
prefetch: {
test: /\.js$/,
chunks: 'all',
},
}),
new MiniCssExtractPlugin({
filename: "[name].css",
chunkFilename: "[id].css"
}),
prod && new OptimizeCSSAssets(),
prod && new webpack.optimize.AggressiveSplittingPlugin(),
].filter(Boolean),
optimization: {
runtimeChunk: 'single',
splitChunks: {
chunks: 'all',
maxInitialRequests: Infinity,
minSize: 0,
cacheGroups: {
vendor: {
test: /[\\/]node_modules[\\/]/,
},
},
},
},
devtool: prod ? 'hidden-source-map' : 'cheap-module-eval-source-map',
});