mirror of
https://github.com/nextui-org/nextui.git
synced 2025-12-08 19:26:11 +00:00
docs: Fix typos in frameworks/nextjs.mdx (#1849)
This commit is contained in:
parent
8d2192183b
commit
c3f762563b
@ -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>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user