astro paper下載 - astro paper原始碼下載

astro paper

其他類別

v4.7.0

下載

天文紙？

專案結構

在 AstroPaper 內部，您將看到以下資料夾和檔案：

/
├── public/
│   ├── assets/
│   │   └── logo.svg
│   │   └── logo.png
│   └── favicon.svg
│   └── astropaper-og.jpg
│   └── robots.txt
│   └── toggle-theme.js
├── src/
│   ├── assets/
│   │   └── socialIcons.ts
│   ├── components/
│   ├── content/
│   │   |  blog/
│   │   |    └── some-blog-posts.md
│   │   └── config.ts
│   ├── layouts/
│   └── pages/
│   └── styles/
│   └── utils/
│   └── config.ts
│   └── types.ts
└── package.json

Astro 在src/pages/目錄尋找.astro或.md檔案。每個頁面都根據其檔案名稱公開為路徑。

任何靜態資源（例如影像）都可以放置在public/目錄中。

所有部落格文章都儲存在src/content/blog目錄中。

文件

文件可以以兩種格式閱讀： markdown和部落格文章。

配置-markdown|部落格文章
新增貼文 - markdown |部落格文章
自訂配色方案 - markdown |部落格文章
預先定義的配色 - markdown |部落格文章

對於 AstroPaper v1，請查看此分支和此即時 URL

技術堆疊

主框架-Astro
類型檢查- TypeScript
元件框架- ReactJS
樣式- TailwindCSS
UI/UX - Figma 設計文件
模糊搜尋- FuseJS
圖示-Boxicons |桌子人
代碼格式化- Prettier
部署- Cloudflare 頁面
關於頁面中的插圖- https://freesvgillustration.com
Linting - ESLint

??‍ 本地運行

您可以透過在所需目錄中執行以下命令來在本機開始使用該專案：

 # npm 6.x
npm create astro@latest --template satnaing/astro-paper

# npm 7+, extra double-dash is needed:
npm create astro@latest -- --template satnaing/astro-paper

# yarn
yarn create astro --template satnaing/astro-paper

# pnpm
pnpm dlx create-astro --template satnaing/astro-paper

警告！如果您使用yarn 1 ，您可能需要安裝sharp作為依賴項。

然後透過執行以下命令啟動專案：

 # install dependencies
npm run install

# start running the project
npm run dev

作為替代方法，如果您安裝了 Docker，則可以使用 Docker 在本機上執行該專案。方法如下：

 # Build the Docker image
docker build -t astropaper .

# Run the Docker container
docker run -p 4321:80 astropaper

Google 網站驗證（可選）

您可以使用環境變數輕鬆在 AstroPaper 中新增 Google 網站驗證 HTML 標記。此步驟是可選的。如果您不新增下列環境變量，則 google-site-verification 標籤將不會出現在 HTML <head>部分。

 # in your environment variable file (.env)
PUBLIC_GOOGLE_SITE_VERIFICATION=your-google-site-verification-value

請參閱此討論，了解如何將 AstroPaper 新增至 Google Search Console。

？命令

所有命令都從專案的根目錄的終端運行：

筆記！對於Docker命令，我們必須將其安裝在您的電腦上。

命令	行動
`npm install`	安裝依賴項
`npm run dev`	在`localhost:4321`啟動本機開發伺服器
`npm run build`	將您的生產網站建置到`./dist/`
`npm run preview`	在部署之前在本地預覽您的構建
`npm run format:check`	使用 Prettier 檢查代碼格式
`npm run format`	使用 Prettier 設定代碼格式
`npm run sync`	為所有 Astro 模組產生 TypeScript 類型。了解更多。
`npm run lint`	使用 ESLint 進行 Lint
`docker compose up -d`	在 docker 上執行 AstroPaper，您可以使用`dev`指令通知的相同主機名稱和連接埠進行存取。
`docker compose run app npm install`	您可以在 docker 容器中執行上面的任何命令。
`docker build -t astropaper .`	為 AstroPaper 建置 Docker 映像。
`docker run -p 4321:80 astropaper`	在 Docker 上運行 AstroPaper。網站可透過`http://localhost:4321`存取。