Skip to content

Commit 7cefb48

Browse files
author
César
authored
docs: Add Next.js configuration info to docs (#1665)
1 parent e915e72 commit 7cefb48

File tree

1 file changed

+20
-0
lines changed

1 file changed

+20
-0
lines changed

docs/Webpack.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,26 @@ module.exports = {
7676

7777
[Create React App](https://github.com/facebook/create-react-app) is supported out of the box, you don’t even need to create a style guide config if your components could be found using a default pattern: all files with `.js` or `.jsx` extensions inside `src/components` or `src/Components` folders.
7878

79+
## Next.js
80+
81+
The [Next.js](https://nextjs.org/) framework abstracts away webpack for you, but it still uses webpack under the hood.
82+
83+
After configuring your webpack loaders in `styleguide.config.js` you will need to also configure Babel. First install all the required Babel dependencies:
84+
85+
```bash
86+
npm install --save-dev babel-loader @babel/core @babel/preset-react
87+
```
88+
89+
Next, you'll want to configure Babel to use the appropriate presets, here is an example `.babelrc` file:
90+
91+
```json
92+
{
93+
"presets": ["@babel/preset-react"]
94+
}
95+
```
96+
97+
That's it, notice that we don't need to install webpack as it's already included by Next.js.
98+
7999
## Non-webpack projects
80100

81101
To use features, not supported by browsers, like JSX, you’ll need to compile your code with Babel or another tool.

0 commit comments

Comments
 (0)