【亲测免费】 Clean-Architecture-zh 项目使用教程

1. 项目的目录结构及介绍

Clean-Architecture-zh 项目的目录结构如下：

Clean-Architecture-zh/
├── .github/
├── docs/
│   ├── ch01.md
│   ├── ch02.md
│   ├── ...
│   └── ch17.md
├── node_modules/
├── public/
├── src/
│   ├── components/
│   ├── styles/
│   └── theme/
├── .gitignore
├── package.json
├── README.md
└── yarn.lock

目录结构介绍

• .github/: 存放 GitHub 相关的配置文件，如 Issue 模板、PR 模板等。
• docs/: 存放项目的文档文件，每个章节对应一个 Markdown 文件。
• node_modules/: 存放项目依赖的 Node.js 模块。
• public/: 存放静态资源文件，如图片、字体等。
• src/: 存放项目的源代码，包括 Vue.js 组件、样式文件和主题配置。
• .gitignore: Git 忽略文件配置。
• package.json: 项目的依赖配置文件。
• README.md: 项目的介绍文件。
• yarn.lock: Yarn 包管理器的锁定文件。

2. 项目的启动文件介绍

项目的启动文件主要包括 package.json 中的脚本命令和 src/ 目录下的入口文件。

package.json

{
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  }
}

• docs:dev: 启动本地开发服务器，用于实时预览文档。
• docs:build: 构建生产环境的静态文件。

src/ 目录

• src/components/: 存放 Vue.js 组件。
• src/styles/: 存放全局样式文件。
• src/theme/: 存放主题配置文件。

3. 项目的配置文件介绍

.gitignore

node_modules/
dist/
.DS_Store

• node_modules/: 忽略 Node.js 模块目录。
• dist/: 忽略构建生成的静态文件目录。
• .DS_Store: 忽略 macOS 系统生成的隐藏文件。

package.json

{
  "name": "clean-architecture-zh",
  "version": "1.0.0",
  "description": "《架构整洁之道》中文翻译",
  "main": "index.js",
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "dependencies": {
    "vuepress": "^1.8.2"
  }
}

• name: 项目名称。
• version: 项目版本号。
• description: 项目描述。
• main: 入口文件。
• scripts: 脚本命令。
• dependencies: 项目依赖。

README.md

# Clean-Architecture-zh

《架构整洁之道》中文翻译项目。

## 快速开始

1. 克隆项目：
   ```bash
   git clone https://github.com/leewaiho/Clean-Architecture-zh.git

2. 安装依赖：

   cd Clean-Architecture-zh
   yarn install
   

3. 启动本地开发服务器：

   yarn docs:dev
   

4. 访问本地服务器：

   http://localhost:8080/
   

- **README.md**: 项目的介绍文件，包含项目的快速开始指南。

通过以上步骤，你可以快速了解并启动 Clean-Architecture-zh 项目。