Yoha 手部追踪引擎项目教程

Yoha 手部追踪引擎项目教程

yoha A practical hand tracking engine. 项目地址: https://gitcode.com/gh_mirrors/yo/yoha

1. 项目目录结构及介绍

Yoha 是一个实用的手部追踪引擎，其项目目录结构如下所示：

yoha/
├── .github/              # GitHub 工作流和配置文件
├── ci/                   # 持续集成配置文件
├── docs/                 # 文档资料
├── example/              # 示例项目
├── src/                  # 源代码目录
│   ├── ...               # 源代码文件
├── .eslintrc.json        # ESLint 配置文件
├── .gitignore            # Git 忽略文件
├── LICENSE               # MIT 许可证文件
├── README.md             # 项目说明文件
├── api-extractor.json     # API 提取配置文件
├── download_models.sh    # 下载模型文件的脚本
├── logo.png              # 项目图标
├── package.json          # 项目依赖和配置
├── report.api.md         # API 文档
├── tsconfig.json         # TypeScript 配置文件
├── webpack.config.js     # Webpack 配置文件
└── yarn.lock             # Yarn 锁定文件

• .github/: 包含 GitHub 工作流和相关配置文件。
• ci/: 持续集成相关的配置文件。
• docs/: 存放项目文档的资料。
• example/: 提供了一个如何使用 Yoha 的示例项目。
• src/: 源代码目录，包含了项目的所有 JavaScript 或 TypeScript 文件。
• .eslintrc.json: ESLint 配置文件，用于定义代码风格和规则。
• .gitignore: 定义了 Git 应该忽略的文件和目录。
• LICENSE: 项目使用的 MIT 许可证。
• README.md: 项目说明文件，包含了项目的介绍、安装和使用说明。
• api-extractor.json: API 提取工具的配置文件。
• download_models.sh: 脚本用于下载项目所需的模型文件。
• logo.png: 项目图标。
• package.json: 定义了项目的依赖、脚本和元数据。
• report.api.md: 生成的 API 文档。
• tsconfig.json: TypeScript 配置文件。
• webpack.config.js: Webpack 配置文件，用于配置项目打包过程。

2. 项目的启动文件介绍

项目的启动主要通过 example/ 目录下的 index.html 和 main.js 文件进行。

• index.html: 是示例项目的 HTML 入口文件，它包含了加载 Yoha 引擎和显示追踪结果的 HTML 代码。
• main.js: 是示例项目的 JavaScript 入口文件，它负责初始化 Yoha 引擎，并处理用户的手部追踪数据。

启动项目的基本步骤如下：

1. 克隆项目到本地：

   git clone https://github.com/handtracking-io/yoha.git
   

2. 进入示例目录并安装依赖：

   cd yoha/example
   yarn
   

3. 启动开发服务器：

   yarn start
   

3. 项目的配置文件介绍

项目的配置主要通过以下几个文件进行：

• package.json: 定义了项目的名称、版本、描述、依赖、脚本等信息。例如，scripts 字段中定义了启动开发服务器和构建生产版本的脚本。

  "scripts": {
    "start": "webpack serve --open",
    "build": "webpack --mode production"
  }
  

• tsconfig.json: TypeScript 配置文件，用于配置 TypeScript 编译器的行为。例如，指定使用的 TypeScript 版本、模块解析策略等。

  {
    "compilerOptions": {
      "target": "es5",
      "module": "commonjs",
      "strict": true,
      ...
    }
  }
  

• webpack.config.js: Webpack 配置文件，用于定义项目的打包过程，包括入口文件、输出配置、加载器（loader）和插件（plugin）等。

  module.exports = {
    entry: './src/main.ts',
    output: {
      filename: 'bundle.js',
      path: path.resolve(__dirname, 'dist'),
    },
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          use: 'ts-loader',
          exclude: /node_modules/,
        },
        ...
      ],
    },
    ...
  };
  

yoha A practical hand tracking engine. 项目地址: https://gitcode.com/gh_mirrors/yo/yoha