3.4 撰寫筆記
圖片與附件
在筆記裡用相對路徑引用圖片,NoteCraftApp 會自動改寫成可存取的網址;也說明支援哪些格式、PDF 附件怎麼連。
圖片直接放在筆記資料夾裡,用相對路徑引用就好,不用另外搬到某個 public/ 資料夾。
寫法
guides/oauth/flow.md

.md 與 .mdx 都適用。路徑相對於這篇筆記所在的資料夾。
會被改寫成什麼
相對路徑會被改寫成 /notes-assets/<相對於筆記資料夾的路徑>。
| 筆記 | 圖片寫法 | 改寫後 |
|---|---|---|
hello.md | ./cover.png | /notes-assets/cover.png |
guides/setup.md | ./img/step1.png | /notes-assets/guides/img/step1.png |
guides/oauth/flow.md | ../../shared/logo.svg | /notes-assets/shared/logo.svg |
這個網址由誰送出,看你用哪個子命令:
| 子命令 | /notes-assets/* 從哪裡來 |
|---|---|
view | 從筆記資料夾即時送出,只回應本機(127.0.0.1)的連線。用 --host 0.0.0.0 讓區網其他電腦連進來時,對方看不到圖片 |
serve | 本機連線一樣即時送出,改圖或新加的圖馬上看得到。區網連線拿的是上次 build 複製進產物的那份:只有被筆記引用的檔案,內容停在上次 build |
build | 產物實際引用到的檔案會複製進 dist/notes-assets/,部署到靜態主機就能送出 |
不會被改寫的
- 完整網址:
https://…、data:… - 已經是
/開頭的絕對路徑 #開頭的頁內錨點- 解析後落在筆記資料夾外面的路徑:照原樣保留,不會送出資料夾以外的檔案
build 只複製被引用的檔案,不會把整個筆記資料夾的圖片帶出去。複製規則見部署。
支援的格式
| 類型 | 副檔名 |
|---|---|
| 點陣圖 | .png、.jpg、.jpeg、.gif、.webp、.avif |
| 向量圖 | .svg |
| 圖示 | .ico |
| 文件 | .pdf |
連到 PDF 附件
一般連結 […](…) 的相對路徑只有指向 .md/.mdx 時會被改寫。要連到筆記資料夾裡的 PDF,直接寫成 /notes-assets/ 開頭的路徑:
Markdown
[下載規格書](/notes-assets/specs/v2.pdf)