项目结构#

/your-astro-project
├── public/
├── src/
│   ├── content/
│   ├── components/
│   ├── layouts/
│   ├── pages/
│   │   └── index.astro
│   ├── styles/
│   └── consts.ts    
├── astro.config.mjs
├── package.json
└── tsconfig.json

文件夹和文件说明#

• public: 存放静态资源的文件夹，例如图像、字体和其他不需要处理的静态文件。这些文件在构建时会直接复制到最终的 dist 目录下，并且可以通过根路径直接访问。
• src: 项目的源代码文件夹，包含了所有的组件、布局、页面和样式等。
  • content: 存放网站内容的文件夹，如博客文章、文档、Markdown 文件等。这些内容文件将用于动态生成页面和其他内容。
  • components: 存放可重用的 UI 组件。
  • layouts: 存放页面布局文件。
  • pages: 存放网站的所有页面文件。每个页面文件都会被 Astro 自动转换成对应的路由。例如，src/pages/index.astro 会生成网站的主页。
  • styles: 存放css的文件夹。
  • consts.ts: 整个项目的配置文件，可以用来存放全局常量。
• astro.config.mjs: Astro 项目的配置文件。用于设置项目的各种配置选项，如构建目录、自定义插件、路由配置等。
• package.json: Node.js 项目的配置文件，包含了项目的依赖项、脚本、项目元数据等。通过 npm install 或 yarn install 命令来安装该文件中列出的依赖项。
• tsconfig.json: TypeScript 配置文件（如果使用 TypeScript）。用于配置 TypeScript 编译器选项，如编译目标、模块解析、类型检查等。

推荐组件和布局#