MIDIano 项目使用教程

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

MIDIano 项目的目录结构如下：

MIDIano/
├── css/
├── fonts/
├── images/
├── js/
├── lib/
├── metronome/
├── .gitignore
├── README.md
├── Screenshot.png
├── blackKey.svg
├── eslintrc.json
├── index.html
├── mz_331_3.mid
├── screenShotNew.png

目录介绍：

• css/：包含项目的样式文件。
• fonts/：包含项目使用的字体文件。
• images/：包含项目使用的图片资源。
• js/：包含项目的 JavaScript 代码。
• lib/：包含项目依赖的第三方库。
• metronome/：包含与节拍器相关的文件。
• .gitignore：Git 忽略文件，指定不需要版本控制的文件和目录。
• README.md：项目的说明文档。
• Screenshot.png：项目的截图文件。
• blackKey.svg：SVG 格式的黑键图片。
• eslintrc.json：ESLint 配置文件，用于代码风格检查。
• index.html：项目的入口 HTML 文件。
• mz_331_3.mid：MIDI 文件示例。
• screenShotNew.png：新的项目截图文件。

2. 项目的启动文件介绍

项目的启动文件是 index.html，它是整个应用的入口文件。用户通过浏览器访问该文件即可启动 MIDIano 应用。index.html 文件中包含了页面的基本结构，并引用了必要的 CSS 和 JavaScript 文件。

3. 项目的配置文件介绍

项目中的配置文件主要是 eslintrc.json，它用于配置 ESLint 代码风格检查工具。该文件定义了代码的格式化规则，确保代码风格的一致性。

eslintrc.json 文件内容示例：

{
  "extends": "eslint:recommended",
  "rules": {
    "indent": ["error", 2],
    "quotes": ["error", "single"],
    "semi": ["error", "always"]
  }
}

该配置文件指定了代码缩进为 2 个空格，使用单引号，并且要求语句末尾必须有分号。