rsnext/examples/modularize-imports
Shu Uesugi c5453453ac
Improve modularized imports docs and add config options to example (#44560)
This PR improves the [Modularize Imports](https://nextjs.org/docs/advanced-features/compiler#modularize-imports) section of Next.js Compiler docs as well as [the `modularize-imports` example](https://github.com/vercel/next.js/tree/canary/examples/modularize-imports). They were originally added in [this PR](https://github.com/vercel/next.js/pull/34969).

- Link to [the `modularize-imports` example](https://github.com/vercel/next.js/tree/canary/examples/modularize-imports) was missing from the docs.
- Clarified some explanations and reorganized the content so it's easier to understand.
- Added docs for `skipDefaultConversion`.
- Added docs for `preventFullImport`.
- Illustrated how to use `kebabCase` and `skipDefaultConversion` on the [the `modularize-imports` example](https://github.com/vercel/next.js/tree/canary/examples/modularize-imports).

## 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)
2023-01-04 21:39:38 +00:00
..
components Improve modularized imports docs and add config options to example (#44560) 2023-01-04 21:39:38 +00:00
pages Improve modularized imports docs and add config options to example (#44560) 2023-01-04 21:39:38 +00:00
.gitignore Update default gitignore templates (#39051) 2022-07-26 20:08:40 -05:00
next.config.js Improve modularized imports docs and add config options to example (#44560) 2023-01-04 21:39:38 +00:00
package.json Convert many examples to TypeScript (#41825) 2022-10-26 20:28:55 +00:00
README.md Improve modularized imports docs and add config options to example (#44560) 2023-01-04 21:39:38 +00:00
tsconfig.json Convert many examples to TypeScript (#41825) 2022-10-26 20:28:55 +00:00

Modularize Imports Example

This example shows how to use the modularizeImports config option.

Preview

Preview the example live on StackBlitz:

Open in StackBlitz

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

How to use

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example modularize-imports modularize-imports-app
yarn create next-app --example modularize-imports modularize-imports-app
pnpm create next-app --example modularize-imports modularize-imports-app

Deploy it to the cloud with Vercel (Documentation).