Skip to content

Commit c92f864

Browse files
authored
fix($docs): update babel-config.md to have new babelServer: true option for universal-import plugin
1 parent a195fe8 commit c92f864

File tree

1 file changed

+6
-5
lines changed

1 file changed

+6
-5
lines changed

docs/babel-config.md

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,17 @@ When using babel for the server, you'll have slightly different webpack config a
66
```
77
{
88
"presets": ["es2015", "react", "stage-2"],
9-
"plugins": ["syntax-dynamic-import", "universal-import", [
9+
"plugins": ["syntax-dynamic-import", [
10+
"universal-import", {
11+
"babelServer": true
12+
}], [
1013
"css-modules-transform", {
1114
"generateScopedName": "[name]__[local]--[hash:base64:5]"
1215
}
1316
]]
1417
}
1518
```
1619

17-
- **[babel-plugin-syntax-dynamic-import](https://github.com/babel/babel/tree/master/packages/babel-plugin-syntax-dynamic-import)** is needed so `import()` doesn't break the Babel compilation.
18-
1920
- For CSS Modules, since you can't rely on webpack anymore to handle importing CSS, we recommend using
2021
[babel-plugin-css-modules-transform](https://github.com/michalkvasnicak/babel-plugin-css-modules-transform)
2122
to generate CSS class names on the server. What it does is take code like this:
@@ -52,7 +53,7 @@ module: {
5253
babelrc: false,
5354
presets: ['es2015', 'react', 'stage-2'],
5455
plugins: [
55-
// 'dynamic-import-webpack' // only needed if Webpack version < 2.2.0
56+
'universal-import' // notice there is no babelServer: true option
5657
// notice there is no 'css-modules-transform' plugin!
5758
]
5859
}
@@ -87,6 +88,6 @@ The following is an older boilerplate that will showcase babel being used with c
8788

8889
- https://github.com/faceyspacey/flush-chunks-boilerplate-babel-chunknames
8990

90-
We aren't promoting this route anymore, but you can definitely learn from how its configured. Specifically how the server babel config is different from the client webpack config. Check the `.babelrc` and the webpack configs. Just keep in mind that with the babel plugin u gotta use `babel-plugin-syntax-dynamic-import` as well, as shown at the top of this doc.
91+
We aren't promoting this route anymore, but you can definitely learn from how its configured. Specifically how the server babel config is different from the babel config within the *client webpack config*. Check the `.babelrc` and the webpack configs.
9192

9293

0 commit comments

Comments
 (0)