-
Notifications
You must be signed in to change notification settings - Fork 491
/
config-overrides.js
149 lines (134 loc) · 3.95 KB
/
config-overrides.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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
/**
* upgrading to react-scripts v5 with any sort of decent sized app causes all kinds of errors
*
* @see https://github.com/facebook/create-react-app/issues/11756#issuecomment-1184657437
* @see https://alchemy.com/blog/how-to-polyfill-node-core-modules-in-webpack-5
*/
import webpack from 'webpack'
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
const PURE_ESM_MODULES = [
'ipfs-geoip',
'ipld-explorer-components',
'@chainsafe/is-ip',
'@multiformats/multiaddr',
'dag-jose',
'uint8arrays'
]
/**
* This function goes through the loader rules and applies modifier function to the said rule.
* Validation can be set within the modifier function.
*
* @param {import('webpack').RuleSetRule[]} rules
* @param {function} modifier defaults to identity function
* @returns {import('webpack').RuleSetRule[]}
*/
function modifyBabelLoaderRules (rules, modifier = r => r) {
return rules.map(rule => {
if (rule.oneOf) {
rule.oneOf = modifyBabelLoaderRules(rule.oneOf, modifier)
} else if (rule.use) {
rule.use = modifyBabelLoaderRules(rule.use, modifier)
} else {
rule = modifier(rule)
}
return rule
})
}
/**
* Adds exclude rules for pure ESM Modules.
*
* @param {import('webpack').RuleSetRule[]} rules
* @returns {import('webpack').RuleSetRule[]}
*/
function modifyBabelLoaderRuleForBuild (rules) {
return modifyBabelLoaderRules(rules, rule => {
if (rule.loader && rule.loader.includes('babel-loader')) {
if ('exclude' in rule) {
if (!Array.isArray(rule.exclude)) {
rule.exclude = [rule.exclude]
}
PURE_ESM_MODULES.forEach(module => {
rule.exclude.push(new RegExp(`node_modules/${module}`))
})
}
}
return rule
})
}
/**
* Adds instrumentation plugin for code coverage in test mode.
*
* @param {import('webpack').RuleSetRule[]} rules
* @returns {import('webpack').RuleSetRule[]}
*/
function modifyBabelLoaderRuleForTest (rules) {
return modifyBabelLoaderRules(rules, rule => {
if (rule.options && rule.options.plugins) {
rule.options.plugins.push('istanbul')
}
return rule
})
}
function webpackOverride (config) {
const fallback = config.resolve.fallback || {}
Object.assign(fallback, {
stream: 'stream-browserify',
os: 'os-browserify/browser',
path: 'path-browserify',
crypto: 'crypto-browserify'
})
config.resolve.fallback = fallback
config.plugins = (config.plugins || []).concat([
new webpack.ProvidePlugin({
process: 'process/browser',
Buffer: ['buffer', 'Buffer']
})
])
/**
* NODE_ENV is overridden by react-scripts/react-app-rewired-esm,
* so we set BUILD_ENV in the analyze script
*/
if (process.env.BUILD_ENV === 'analyze') {
config.plugins.push(
new BundleAnalyzerPlugin({
analyzerMode: 'server',
openAnalyzer: true
})
)
}
config.module.rules = modifyBabelLoaderRuleForBuild(config.module.rules)
config.module.rules.push({
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel-loader',
options: { presets: ['@babel/env', '@babel/preset-react'] }
})
config.module.rules.push({
test: /\.m?js$/,
type: 'javascript/auto',
resolve: {
fullySpecified: false
}
})
config.resolve.extensions = ['.js', '.jsx', '.tsx', '.ts', '...']
// Instrument for code coverage in development mode
const REACT_APP_ENV = process.env.REACT_APP_ENV ?? process.env.NODE_ENV ?? 'development'
if (REACT_APP_ENV === 'test') {
config.module.rules = modifyBabelLoaderRuleForTest(config.module.rules)
config.devtool = 'inline-source-map'
} else if (REACT_APP_ENV === 'development') {
config.optimization = {
...config.optimization,
minimize: false,
mangleExports: false,
innerGraph: false,
moduleIds: 'named'
}
config.devtool = 'source-map'
}
return config
}
const configOverride = {
webpack: webpackOverride
}
export default configOverride