ChocolateChip-UI 技术文档

1. 安装指南

1.1 安装 Node.js

ChocolateChip-UI 使用 Gulp.js 进行构建，因此首先需要安装 Node.js。你可以通过以下链接下载并安装 Node.js：

• Node.js 官方网站

1.2 安装 Gulp.js

在安装 Node.js 后，你需要全局安装 Gulp.js。根据你的操作系统，执行以下命令：

• Mac OS X:

  sudo npm install -g gulp
  

• Windows:

  npm install -g gulp
  

1.3 安装 ChocolateChip-UI

你可以通过 NPM 安装 ChocolateChip-UI。执行以下命令：

npm install -g chui

2. 项目的使用说明

2.1 创建项目

使用 chui 命令可以快速创建 ChocolateChip-UI 项目。你可以选择不同的平台和项目类型。以下是一些示例：

• 创建 Android 项目：

  chui -n myProject -o android -t basic
  

• 创建 iOS 项目：

  chui -n myProject -o ios -t navigation
  

• 创建支持 JSX 的项目：

  chui -n myProject -o android -x
  

2.2 查看示例

ChocolateChip-UI 提供了针对 iOS、Android 和 Windows Phone 的示例。你可以通过以下方式查看这些示例：

• iOS 示例： 使用 Safari 浏览器。
• Android 示例： 使用 Chrome 浏览器。
• Windows Phone 示例： 使用 IE 10 或 MS Edge 浏览器。

3. 项目 API 使用文档

3.1 基本 API

ChocolateChip-UI 提供了丰富的 API，用于创建和管理移动 Web 应用。以下是一些常用的 API：

• 模板引擎： 使用模板引擎可以动态生成 HTML 内容。
• Ajax 请求： 通过 Ajax 请求获取数据并更新页面内容。
• 事件处理： 处理用户交互事件，如点击、滑动等。

3.2 自定义主题

你可以通过修改 LESS 文件来自定义主题。使用 Gulp.js 可以自动监听并重新构建主题。

• 监听所有主题：

  gulp watch
  

• 监听特定平台主题：

  gulp watch_android
  

4. 项目安装方式

4.1 使用 NPM 安装

通过 NPM 安装 ChocolateChip-UI 是最快捷的方式。执行以下命令：

npm install -g chui

4.2 手动构建

如果你需要对源码进行修改，可以通过 Gulp.js 手动构建项目。执行以下命令：

gulp

这将生成包含所有示例和主题的文件夹。

4.3 使用 ChocolateChipJS

如果你不想使用 jQuery，可以选择使用 ChocolateChipJS。执行以下命令：

gulp --chocolatechipjs

这将使用 ChocolateChipJS 替换 jQuery，并生成相应的示例。

5. 贡献代码

5.1 避免换行符问题

在 Windows 上编辑源码时，可能会引入 Windows 风格的换行符。为了避免这个问题，可以执行以下 Git 命令：

git config core.eol lf
git config core.autocrlf input

这将确保 Git 在提交时将换行符转换为 Unix 风格。

---

通过以上文档，你应该能够顺利安装和使用 ChocolateChip-UI 框架，并了解如何自定义和贡献代码。