1 | /** |
||
2 | * Build configuration for client source bundling using Webpack |
||
3 | */ |
||
4 | const { resolve } = require('path'); |
||
5 | const webpack = require('webpack'); |
||
0 ignored issues
–
show
introduced
by
Loading history...
|
|||
6 | |||
7 | const config = require('./src/config/server.config'); |
||
8 | |||
9 | const commonConfig = { |
||
10 | context: resolve(__dirname, config.build.sourceDirectory), |
||
11 | entry: config.build.clientEntry, |
||
12 | output: { |
||
13 | filename: config.build.clientOutputJsFileName, |
||
14 | path: resolve(__dirname, config.build.clientOutputDirectoryName), |
||
15 | }, |
||
16 | resolve: { |
||
17 | extensions: ['.js', '.jsx', '.json'], |
||
18 | }, |
||
19 | module: { |
||
20 | rules: [ |
||
21 | { test: /\.json$/, loader: 'json-loader' }, |
||
22 | { |
||
23 | test: /\.jsx?$/, |
||
24 | use: ['babel-loader'], |
||
25 | exclude: /node_modules/, |
||
26 | }, |
||
27 | { |
||
28 | test: /(\.scss|\.css)$/, |
||
29 | use: [ |
||
30 | { loader: 'style-loader' }, |
||
31 | { loader: 'css-loader', options: { modules: 'global', sourceMap: true } }, |
||
32 | { loader: 'sass-loader' }, |
||
33 | ], |
||
34 | }, |
||
35 | ], |
||
36 | }, |
||
37 | node: { |
||
38 | dns: 'mock', |
||
39 | net: 'mock', |
||
40 | }, |
||
41 | plugins: [ |
||
42 | new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('production') }), |
||
43 | new webpack.NoEmitOnErrorsPlugin(), |
||
44 | ], |
||
45 | optimization: { |
||
46 | namedModules: false, |
||
47 | namedChunks: false, |
||
48 | nodeEnv: 'production', |
||
49 | flagIncludedChunks: true, |
||
50 | occurrenceOrder: true, |
||
51 | sideEffects: true, |
||
52 | usedExports: true, |
||
53 | concatenateModules: true, |
||
54 | splitChunks: { |
||
55 | hidePathInfo: true, |
||
56 | minSize: 30000, |
||
57 | maxAsyncRequests: 5, |
||
58 | maxInitialRequests: 3, |
||
59 | }, |
||
60 | noEmitOnErrors: true, |
||
61 | checkWasmTypes: true, |
||
62 | minimize: true, |
||
63 | }, |
||
64 | }; |
||
65 | |||
66 | const webpackConfig = Object.assign({}, commonConfig); |
||
67 | |||
68 | if (process.env.NODE_ENV === 'development') { |
||
69 | webpackConfig.mode = 'development'; |
||
70 | webpackConfig.devtool = 'cheap-module-eval-source-map'; |
||
71 | webpackConfig.output.publicPath = `${config.url.publicPrefix}/`; |
||
72 | |||
73 | webpackConfig.entry = [ |
||
74 | 'react-hot-loader/patch', |
||
75 | // activate HMR for React |
||
76 | |||
77 | `webpack-dev-server/client?http://0.0.0.0:${config.build.webpackServerPort}/`, |
||
78 | // bundle the client for webpack-dev-server |
||
79 | // and connect to the provided endpoint |
||
80 | |||
81 | 'webpack/hot/only-dev-server', |
||
82 | // bundle the client for hot reloading |
||
83 | // only- means to only hot reload for successful updates |
||
84 | |||
85 | config.build.clientEntry, |
||
86 | // the entry point of our app |
||
87 | ]; |
||
88 | webpackConfig.plugins = [ |
||
0 ignored issues
–
show
|
|||
89 | new webpack.HotModuleReplacementPlugin(), |
||
90 | // enable HMR globally |
||
91 | new webpack.NamedModulesPlugin(), |
||
92 | // prints more readable module names in the browser console on HMR updates |
||
93 | ]; |
||
94 | } |
||
95 | |||
96 | module.exports = webpackConfig; |
||
97 |