-
-
Notifications
You must be signed in to change notification settings - Fork 225
/
webpack.config.js
122 lines (117 loc) · 4.34 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
121
122
const path = require("path")
const MiniCssExtractPlugin = require("mini-css-extract-plugin")
const ManifestPlugin = require("webpack-manifest-plugin")
const MomentLocalesPlugin = require("moment-locales-webpack-plugin")
const Dotenv = require("dotenv-webpack")
const TerserJSPlugin = require("terser-webpack-plugin")
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin")
module.exports = (env, argv) => {
const isProduction = argv.mode === "production"
return {
cache: {
type: "filesystem",
buildDependencies: {
config: [__filename],
},
},
mode: isProduction ? "production" : "development",
context: __dirname,
entry: {
admin: "./adminSite/client/admin.entry.ts",
owid: "./site/client/owid.entry.ts",
},
target: "web",
optimization: {
splitChunks: {
cacheGroups: {
commons: {
name: "commons",
chunks: "all",
minChunks: 2,
},
},
},
minimize: isProduction,
minimizer: [new TerserJSPlugin(), new OptimizeCSSAssetsPlugin()],
},
performance: {
hints: false,
},
output: {
path: path.join(__dirname, "dist/webpack"),
filename: "js/[name].js",
//filename: (isProduction ? "js/[name].bundle.[hash].js" : "js/[name].js")
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".css"],
modules: ["node_modules", __dirname],
},
module: {
rules: [
{
test: /\.tsx?$/,
loader: "ts-loader",
exclude: /serverSettings/,
options: {
transpileOnly: true,
configFile: path.join(
__dirname,
"tsconfig.client.json"
),
},
},
{
test: /\.s?css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader?url=false",
"postcss-loader",
{
loader: "sass-loader",
options: {
sassOptions: {
outputStyle: "expanded", // Needed so autoprefixer comments are included
},
},
},
],
},
{
test: /\.(jpe?g|gif|png|eot|woff|ttf|svg|woff2)$/,
loader: "url-loader",
options: {
limit: 10000,
useRelativePaths: true,
publicPath: "../",
},
},
],
},
plugins: [
// This plugin extracts css files required in the entry points
// into a separate CSS bundle for download
new MiniCssExtractPlugin({ filename: "css/[name].css" }),
// Writes manifest.json which production code reads to know paths to asset files
new ManifestPlugin(),
// Remove all moment locales except for "en"
// This way of doing so is recommended by Moment itself: https://momentjs.com/docs/#/use-it/webpack/
new MomentLocalesPlugin(),
// This plugin loads settings from .env so we can import them
// Note that this means the settings become part of the client-side JS at webpack build time, not at server run time
new Dotenv(),
],
devServer: {
host: "localhost",
port: 8090,
contentBase: "public",
disableHostCheck: true,
headers: {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods":
"GET, POST, PUT, DELETE, PATCH, OPTIONS",
"Access-Control-Allow-Headers":
"X-Requested-With, content-type, Authorization",
},
},
}
}