blob: 3718e895742ff2b14e3210a3ee0e7f198d365f6a (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
---
layout: ~/layouts/MainLayout.astro
title: 快速開始
lang: zh-Hant-TW
---
```shell
# 環境需求:檢查 Node.js 版本是 12.20.0+、14.13.1+ 或 16+。
node --version
# 開新專案資料夾,並且直接移動到該處
mkdir my-astro-project && cd $_
# 準備發射...
npm init astro
# 安裝相依套件
npm install
# 開始開發!
npm run dev
# 做好之後:把靜態網站 build 進 `dist/`
npm run build
```
若想要知道還有哪些方法能夠以 Astro 來做專案,請[閱讀安裝指南](installation)。
## 開始專案
專案目錄裡,在終端機輸入以下指令:
```bash
npm run dev
```
現在,Astro 就會開啟應用程式的伺服器,位置是 [http://localhost:3000](http://localhost:3000)。在瀏覽器打開這網址,就會看到 Astro 的 「Hello, World」。
伺服器會即時監聽 `src/` 資料夾的檔案異動,所以在開發過程的更新毋需重新啟動應用程式。
## Build 專案
若要將專案 Build 起來,移至資料夾裡面,在終端機輸入指令:
```bash
npm run build
```
這樣就會指揮 Astro 開始 Build 網站,存在磁碟裡。現在,應用程式已經放在 `dist/` 資料夾裡準備好了。
## 部署專案
Astro 網站是靜態的,所以可以發布至慣用的主機:
- [Vercel](https://vercel.com/)
- [Netlify](https://www.netlify.com/)
- [S3 bucket](https://aws.amazon.com/s3/)
- [Google Firebase](https://firebase.google.com/)
- [「部署指南」有更多部署 Astro 的細節。](/guides/deploy)
## 下一步
成功了!現在即可開始開發!
我們建議花點時間更熟悉 Astro 的運作方式。只要在文件裡進一步探索,建議看看這些:
📚 深入了解 Astro 的專案架構:[專案架構指南。](/core-concepts/project-structure)
📚 深入了解 Astro 的元件語法:[Astro 元件指南。](/core-concepts/astro-components)
📚 深入了解 Astro 根據檔案產生的路徑:[路徑指南。](core-concepts/astro-pages)
|