Frontend/進階_React框架/docs/Structure.md
Tim_note 72a0eae2d1 a
2025-02-08 14:02:40 +08:00

26 lines
783 B
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 專案結構
此專案結構可以理解為何在改完程式後按ctrl+s儲存網頁會馬上更新
不用像傳統vs一樣熱重載+f5網頁重整才能看到結果
因為vite伺服器有幫忙裝熱重載模組
專案儲存後React會自動將元件渲染在html上
## (重要)html與tsx的關係
![image](../assets/2-2.jpg)
### APP.tsx與APP.css
React框架下主要開發的頁面
### index.html與index.css
用來包裝App.tsx頁面
index.css主要用來改全域的css
### main.tsx
程式進入點將App.tsx渲染在index.html上然後將網站run起來
(可以以winform或pyqt的app.run下去理解)
## Vite.config.ts
可以更改網站port號
![image](../assets/2-1.jpg)
## Package.json
安裝套件資訊都在這
![image](../assets/2-3.jpg)