Skip to content

Commit

Permalink
Remove experimental for modularizeImports from docs and example (#44311)
Browse files Browse the repository at this point in the history
When `modularizeImports` was moved out of experiimental [on this PR](#44240), `docs` and `examples` were not updated.

- Update `modularize-imports` example by removing `experimental` from `next.config.js`, as it's currently failing when deployed
- For docs: https://nextjs.org/docs/advanced-features/compiler#modularize-imports
  - Move `Modularize Imports` section outside of `Experimental Features` section 
  - Remove `experimental` from code snippets
  - Added to version history, just like when SWC Minifier became stable.

## Documentation / Examples

- [x] Make sure the linting passes by running `pnpm build && pnpm lint`
- [x] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
  • Loading branch information
chibicode committed Dec 23, 2022
1 parent 44548dd commit f0aa10b
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 42 deletions.
71 changes: 34 additions & 37 deletions docs/advanced-features/compiler.md
Expand Up @@ -9,6 +9,7 @@ description: Learn about the Next.js Compiler, written in Rust, which transforms

| Version | Changes |
| --------- | ---------------------------------------------------------------------------------------------------------------------------------- |
| `v13.1.0` | Modularize Imports [stable](https://nextjs.org/blog/next-13-1#import-resolution-for-smaller-bundles). |
| `v13.0.0` | SWC Minifier enabled by default. |
| `v12.3.0` | SWC Minifier [stable](https://nextjs.org/blog/next-12-3#swc-minifier-stable). |
| `v12.2.0` | [SWC Plugins](#swc-plugins-Experimental) experimental support added. |
Expand Down Expand Up @@ -264,30 +265,6 @@ module.exports = {
}
```

## Experimental Features

### Minifier debug options

While the minifier is experimental, we are making the following options available for debugging purposes. They will not be available once the minifier is made stable.

```js
// next.config.js

module.exports = {
experimental: {
swcMinifyDebugOptions: {
compress: {
defaults: true,
side_effects: false,
},
},
},
}
```

If your app works with the options above, it means `side_effects` is the problematic option.
See [the SWC documentation](https://swc.rs/docs/configuration/minification#jscminifycompress) for detailed options.

### Modularize Imports

Allows to modularize imports, similar to [babel-plugin-transform-imports](https://www.npmjs.com/package/babel-plugin-transform-imports).
Expand All @@ -312,14 +289,12 @@ Config for the above transform:
```js
// next.config.js
module.exports = {
experimental: {
modularizeImports: {
'react-bootstrap': {
transform: 'react-bootstrap/lib/{{member}}',
},
lodash: {
transform: 'lodash/{{member}}',
},
modularizeImports: {
'react-bootstrap': {
transform: 'react-bootstrap/lib/{{member}}',
},
lodash: {
transform: 'lodash/{{member}}',
},
},
}
Expand All @@ -336,11 +311,9 @@ The config:
```js
// next.config.js
module.exports = {
experimental: {
modularizeImports: {
'my-library/?(((\\w*)?/?)*)': {
transform: 'my-library/{{ matches.[1] }}/{{member}}',
},
modularizeImports: {
'my-library/?(((\\w*)?/?)*)': {
transform: 'my-library/{{ matches.[1] }}/{{member}}',
},
},
}
Expand Down Expand Up @@ -371,6 +344,30 @@ This transform uses [handlebars](https://docs.rs/handlebars) to template the rep
2. `member`: Has type `string`. The name of the member import.
3. `lowerCase`, `upperCase`, `camelCase`, `kebabCase`: Helper functions to convert a string to lower, upper, camel or kebab cases.

## Experimental Features

### Minifier debug options

While the minifier is experimental, we are making the following options available for debugging purposes. They will not be available once the minifier is made stable.

```js
// next.config.js

module.exports = {
experimental: {
swcMinifyDebugOptions: {
compress: {
defaults: true,
side_effects: false,
},
},
},
}
```

If your app works with the options above, it means `side_effects` is the problematic option.
See [the SWC documentation](https://swc.rs/docs/configuration/minification#jscminifycompress) for detailed options.

### SWC Trace profiling

You can generate SWC's internal transform traces as chromium's [trace event format](https://docs.google.com/document/d/1CvAClvFfyA5R-PhYUmn5OOQtYMH4h6I0nSsKchNAySU/preview?mode=html#%21=).
Expand Down
8 changes: 3 additions & 5 deletions examples/modularize-imports/next.config.js
Expand Up @@ -4,11 +4,9 @@
* @type {import('next').NextConfig}
**/
const nextConfig = {
experimental: {
modularizeImports: {
'../components/halves': {
transform: '../components/halves/{{ member }}',
},
modularizeImports: {
'../components/halves': {
transform: '../components/halves/{{ member }}',
},
},
}
Expand Down

0 comments on commit f0aa10b

Please sign in to comment.