-
Notifications
You must be signed in to change notification settings - Fork 10.3k
/
gatsby-node.js
78 lines (68 loc) · 1.97 KB
/
gatsby-node.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
import resolve from "./resolve"
const CSS_PATTERN = /\.css$/
const MODULE_CSS_PATTERN = /\.module\.css$/
const isCssRules = rule =>
rule.test &&
(rule.test.toString() === CSS_PATTERN.toString() ||
rule.test.toString() === MODULE_CSS_PATTERN.toString())
const findCssRules = config =>
config.module.rules.find(
rule => Array.isArray(rule.oneOf) && rule.oneOf.every(isCssRules)
)
exports.onCreateWebpackConfig = (
{ actions, stage, loaders, getConfig },
// eslint-disable-next-line no-unused-vars
{ cssLoaderOptions = {}, postCssPlugins, plugins, ...postcssLoaderOptions }
) => {
const isSSR = [`develop-html`, `build-html`].includes(stage)
const config = getConfig()
const cssRules = findCssRules(config)
if (!postcssLoaderOptions.postcssOptions) {
postcssLoaderOptions.postcssOptions = {}
}
if (postCssPlugins) {
postcssLoaderOptions.postcssOptions.plugins = postCssPlugins
}
const postcssLoader = {
loader: resolve(`postcss-loader`),
options: postcssLoaderOptions,
}
const postcssRule = {
test: CSS_PATTERN,
use: isSSR
? [loaders.null()]
: [
loaders.miniCssExtract(),
loaders.css({
...cssLoaderOptions,
importLoaders: 1,
modules: false,
}),
postcssLoader,
],
}
const postcssRuleModules = {
test: MODULE_CSS_PATTERN,
use: [
!isSSR &&
loaders.miniCssExtract({
modules: {
namedExport: cssLoaderOptions.modules?.namedExport ?? true,
},
}),
loaders.css({
...cssLoaderOptions,
importLoaders: 1,
modules: cssLoaderOptions.modules ?? true,
}),
postcssLoader,
].filter(Boolean),
}
const postcssRules = { oneOf: [postcssRuleModules, postcssRule] }
if (cssRules) {
cssRules.oneOf.unshift(...postcssRules.oneOf)
actions.replaceWebpackConfig(config)
} else {
actions.setWebpackConfig({ module: { rules: [postcssRules] } })
}
}