#My Additions and Modifications (Continuous Updates)#
-
Change the site URL in astro.config.mjs in the root directory
-
Note: If biome.yaml is not deleted, there will be bugs on mobile devices
-
Media resources are all placed in the public folder
-
build.yml can also be deleted for the following reasons:
- The build functionality in build.yml is already included in astro_auto_deploy.yml
- Node.js version issues
build.yml uses Node.js versions 22 and 23
These versions are too new and may be unstable
While astro_auto_deploy.yml uses the more stable Node.js 20 - For personal blog projects, such complex build checks are unnecessary
Keeping one deployment workflow is sufficient
- Configuration for the number of content items displayed on the homepage, it is in export const PAGE_SIZE = 8
#Some Auxiliary Tools (Continuous Updates)#
- Icon icons: You need to go to icones.js to search for the icons you want
#Related Build Commands#
The following commands need to be executed in the project root directory:
| Command | Action |
|---|---|
pnpm install and pnpm add sharp | Install dependencies |
pnpm dev/npm run dev | Start the local development server at localhost:4321 |
pnpm build | Build the website to ./dist/ |
pnpm preview | Preview the built website locally |
pnpm new-post <filename> | Create a new post |
pnpm astro ... | Execute commands like astro add, astro check, etc. |
pnpm astro --help | Show Astro CLI help |
#Basic Information Usage#
1. Rewrite config.ts#
- title: Your blog's main title
- subtitle: Your blog's subtitle. Optional, will be displayed on the homepage as "Main Title - Subtitle"
- lang: The display language of the blog. Comments have listed some common values, such as: en, zh_CN, zh_TW, ja, ko
- themeColor: The hue value is your blog's theme color, which you can determine by selecting your preferred color using the palette icon in the upper right corner of your blog
- banner: src: the banner image, supports http/https URL
- favicon: src: the website icon, supports http/https URL
- links: friendly links, these links appear in the navigation bar
- avatar: your avatar
- name: your name
- bio: your personal signature, displayed under the avatar and name
- NavBarConfig sets hyperlinks for the navigation bar. ProfileConfig is the hyperlink for your user
2. Article Format Frontmatter#
---
title: My First Blog Post
published: 2023-09-09
updated: 2023-09-09
description: This is the first post of my new Astro blog.
image: ./cover.jpg
tags: [Foo, Bar]
category: Front-end
draft: false
lang: zh_CN # Only set if the article language is different from the website language in `config.ts`
---