首頁 > web前端 > js教程 > #ow 在本機系統上設定 Next-React。

#ow 在本機系統上設定 Next-React。

Linda Hamilton
發布: 2024-10-14 06:25:29
原創
362 人瀏覽過

#ow to setup Next-React on your local system.

要使用 npx create-next-app@latest 指令安裝 React with Next.js,請依照下列步驟操作:

1. 確保已安裝 Node.js

在建立 Next.js 專案之前,您需要在系統上安裝 Node.js。透過運行檢查是否已安裝:

node -v
登入後複製

如果您沒有安裝,請從Node.js官網下載並安裝。

2. 開啟終端機或命令提示字元

在 Windows 上,開啟 指令提示字元PowerShell。在 macOS 或 Linux 上,開啟 終端機

3. 導航到您要建立專案的資料夾

使用 cd 指令導航到您要在其中建立新專案的資料夾。例如:

cd path/to/your/project/folder
登入後複製

4. 執行 npx create-next-app@latest 指令

現在,執行以下命令:

npx create-next-app@latest
登入後複製
  • 這將提示您一些配置新 Next.js 專案的問題。
  • 問題和回答範例:
    • 您的專案名稱是什麼? :提供項目名稱(例如 my-next-app)。
    • 您想使用 TypeScript 嗎? :依照您的喜好選擇「是」或「否」。
    • 您想使用 ESLint 嗎? :根據您是否要啟用 linting 選擇「是」或「否」。
    • 您想使用 Tailwind CSS 嗎? :如果您打算使用 Tailwind 進行樣式設置,請選擇「是」。
    • 您想使用 src/ 目錄嗎? :選擇是或否。
    • 您想使用 App Router 嗎? :依照您的喜好選擇「是」或「否」。
    • 您想自訂預設匯入別名嗎? :選擇「是」或「否」。

回答完所有提示後,該命令將安裝所有必要的依賴項並建立專案文件。

5. 導航到您的新專案資料夾

安裝完成後,導覽至新的 Next.js 專案的資料夾:

cd my-next-app
登入後複製

將 my-next-app 替換為您專案的實際名稱。

6. 運行開發伺服器

要啟動開發伺服器並查看新的 Next.js 專案的運作情況,請執行:

npm run dev
登入後複製

預設情況下,您的專案可以透過 http://localhost:3000 存取。

7. 在程式碼編輯器中開啟項目

在您喜歡的程式碼編輯器中開啟專案資料夾,例如 VS Code:

code .
登入後複製

現在您已經成功建立並設定了一個新的 Next.js (React) 專案!

以上是#ow 在本機系統上設定 Next-React。的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板