This commit is contained in:
Tim_note 2025-02-08 01:01:56 +08:00
parent b55e3ec228
commit d30959f0c6

View File

@ -1,24 +1,24 @@
# 🌟 Node.js 與 npm 簡介
# Node.js 與 npm 簡介
## 📌 Node.js 是什麼?
## Node.js 是什麼?
Node.js 是一個 **不需要開啟網頁就能執行 JavaScript** 的環境,讓 JavaScript 可以在 **伺服器端運行**,而不只是瀏覽器內使用。
## 📌 npmNode Package Manager是什麼
## npmNode Package Manager是什麼
npm 是 **Node.js 內建的套件管理工具**,類似於 `pip`Python`NuGet`C#)。
它的主要用途
它的主要用途包括
- **管理 JavaScript 套件**(安裝、更新、移除)
- **處理前端與後端的開發依賴**
- **自動化開發工作(如打包、測試、部署)**
---
## 🔧 為什麼使用 React 仍然需要 npm
npm 本身是 **JavaScript 寫成的工具****需要 Node.js 在背景執行** 來處理指令。
雖然 **React 只負責前端開發,不會用到 Node.js**,但仍然需要 npm 來安裝開發工具與相關套件。
## 為什麼使用 React 仍然需要 npm
npm 本身是 **JavaScript 寫成的工具**,需要 Node.js 在背景執行來處理指令。
雖然 **React 只負責前端開發,不會用到 Node.js**,但仍然需要 npm 來安裝開發工具與相關套件。
**例如,開發 React 項目時,你可能會用到以下工具:**
開發 React 項目時,常見的 npm 套件如下:
### 📦 **常用 npm 套件React 開發必備)**
### 常用 npm 套件React 開發必備)
| **類別** | **套件名稱** | **用途** |
|----------|------------|---------|
| **React 本體** | `react`, `react-dom` | React 組件核心 |
@ -31,59 +31,12 @@ npm 本身是 **JavaScript 寫成的工具****需要 Node.js 在背景執行*
---
## 🚀 如何安裝 Node.js 與 npm
📌 **1. 下載與安裝 Node.js自動附帶 npm**
🔗 [Node.js 官方網站](https://nodejs.org/)(建議下載 LTS 版本)
## 安裝 Node.js 與 npm
### 1. 下載與安裝 Node.js自動附帶 npm
官方下載連結:[Node.js 官網](https://nodejs.org/)(建議下載 LTS 版本)
📌 **2. 檢查 Node.js 與 npm 是否安裝成功**
```bash
### 2. 在Vscode檢查安裝是否成功
```
node -v # 檢查 Node.js 版本
npm -v # 檢查 npm 版本
# Vscode編譯器
vscode本身沒有支援npm需去下載nodejshttps://nodejs.org/zh-tw
下載完vscode終端檢查有無node.js
```
node -v
```
檢查有無npm
```
npm -v
```
# Package.json
這個跟nuget一樣會有一個dependencies去記錄你安裝的套件
```
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.7.0"
}
```
當別人拿到你的程式碼時,他們只需要執行
```
npm install
```
先下載Node.js 並安裝
於準備開發的資料夾下方開啟CMD
檢查有無node.js
```
npm -v
```
# React
## 基於VUE 可以更有效率地進行前端省了很多路由部分可以直接創建Page即可開始
先下載Node.js 並安裝
於準備開發的資料夾下方開啟CMD
檢查有無node.js
```
npm -v
```