docs: Fix typos in frameworks/nextjs.mdx (#1849)

This commit is contained in:
Danny Nemer 2023-11-02 07:02:39 -07:00 committed by GitHub
parent 8d2192183b
commit c3f762563b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -19,7 +19,7 @@ Requirements:
To use NextUI in your Next.js project, you need to follow the steps below, depending on your project structure. To use NextUI in your Next.js project, you need to follow the steps below, depending on your project structure.
## App directory Setup ## App Directory Setup
Next.js 13 introduces a new `app/` directory structure. By default it uses Server Components. Next.js 13 introduces a new `app/` directory structure. By default it uses Server Components.
As NextUI components use React hooks, we added the `use client;` at build time, so you can import them As NextUI components use React hooks, we added the `use client;` at build time, so you can import them
@ -27,7 +27,7 @@ directly in your React Server Components (RSC).
### create-next-app ### create-next-app
If you are starting a new project, you can run one of the following command to create a Next.js project pre-configured with NextUI: If you are starting a new project, you can run one of the following commands to create a Next.js project pre-configured with NextUI:
<PackageManagers <PackageManagers
commands={{ commands={{
@ -43,7 +43,7 @@ If you are starting a new project, you can run one of the following command to c
### Add dependencies ### Add dependencies
In your Next.js project, run one of the following command to install NextUI: In your Next.js project, run one of the following commands to install NextUI:
<PackageManagers <PackageManagers
commands={{ commands={{
@ -101,7 +101,7 @@ export function Providers({children}: { children: React.ReactNode }) {
### Add Provider to Root ### Add Provider to Root
Now, Go to your `root` layout page and wrap it with the `NextUIProvider`: Now, Go to your `root` layout page and wrap it with the `Providers`:
```jsx {6,8,10} ```jsx {6,8,10}
// app/layout.tsx // app/layout.tsx
@ -120,7 +120,7 @@ export default function RootLayout({children}: { children: React.ReactNode }) {
} }
``` ```
> **Note**: NextUI automatically add two themes `light` and `dark` to your application. You can use any > **Note**: NextUI automatically adds two themes, `light` and `dark`, to your application. You can use any
of them by adding the `dark`/`light` class to the `html` tag. See the [theme docs](/docs/customization/customize-theme) for more details. of them by adding the `dark`/`light` class to the `html` tag. See the [theme docs](/docs/customization/customize-theme) for more details.
@ -141,7 +141,7 @@ export default function Page() {
) )
} }
``` ```
> **Important 🚨**: Note that you need to import the component from the individual package, not the from `@nextui-org/react`. > **Important 🚨**: Note that you need to import the component from the individual package, not from `@nextui-org/react`.
### Setup pnpm (optional) ### Setup pnpm (optional)
@ -151,7 +151,7 @@ If you are using pnpm, you need to add the following code to your `.npmrc` file:
public-hoist-pattern[]=*@nextui-org/* public-hoist-pattern[]=*@nextui-org/*
``` ```
After modfiying the `.npmrc` file, you need to run `pnpm install` again to ensure that the dependencies are installed correctly. After modifying the `.npmrc` file, you need to run `pnpm install` again to ensure that the dependencies are installed correctly.
</Steps> </Steps>
@ -164,7 +164,7 @@ If you are using the `/pages` Next.js project structure, you need to follow the
### create-next-app ### create-next-app
If you are starting a new project, you can run one of the following command to create a Next.js project pre-configured with NextUI: If you are starting a new project, you can run one of the following commands to create a Next.js project pre-configured with NextUI:
<PackageManagers <PackageManagers
commands={{ commands={{
@ -180,7 +180,7 @@ If you are starting a new project, you can run one of the following command to c
### Add dependencies ### Add dependencies
In your Next.js project, run one of the following command to install NextUI: In your Next.js project, run one of the following commands to install NextUI:
<PackageManagers <PackageManagers
commands={{ commands={{
@ -260,7 +260,7 @@ If you are using pnpm, you need to add the following code to your `.npmrc` file:
public-hoist-pattern[]=*@nextui-org/* public-hoist-pattern[]=*@nextui-org/*
``` ```
After modfiying the `.npmrc` file, you need to run `pnpm install` again to ensure that the dependencies are installed correctly. After modifying the `.npmrc` file, you must run `pnpm install` again to ensure the dependencies are installed correctly.
</Steps> </Steps>
@ -268,4 +268,4 @@ After modfiying the `.npmrc` file, you need to run `pnpm install` again to ensur
color="warning" color="warning"
> >
Version 2 is only compatible with React 18 or later. If you are using React 17 or earlier, please use <Link href="https://v1.nextui.org/docs/getting-started" isExternal>version 1 of NextUI</Link>. Version 2 is only compatible with React 18 or later. If you are using React 17 or earlier, please use <Link href="https://v1.nextui.org/docs/getting-started" isExternal>version 1 of NextUI</Link>.
</Blockquote> </Blockquote>