Taro 项目基于 node，请确保已具备较新的 node 环境（>=12.0.0）。

CLI工具安装

先全局安装CLI工具@tarojs/cli。

# 使用 npm 安装 CLI
$ npm install -g @tarojs/cli

# OR 使用 yarn 安装 CLI
$ yarn global add @tarojs/cli

# OR 安装了 cnpm，使用 cnpm 安装 CLI
$ cnpm install -g @tarojs/cli

也可以不用全局安装CLI工具，使用npx直接创建项目模版

$ npx @tarojs/cli init myApp

 安装过程中可能出现报错，可以安装 mirror-config-china 后再重新安装CLI工具。

$ npm install -g mirror-config-china

 安装后可以通过npm info查看taro版本信息：

npm info @tarojs/cli

项目初始化

使用命令创建项目模版：

$ taro init myApp

npm 5.2+ 也可在不全局安装的情况下使用 npx 创建模板项目：

$ npx @tarojs/cli init myApp

创建时会选择项目模版（借用一张官网图片）：

在创建完项目之后，Taro 会默认开始安装项目所需要的依赖，安装使用的工具按照 yarn > cnpm > npm 顺序进行检测。一般来说，依赖安装会比较顺利，但某些情况下可能会安装失败，这时候你可以在项目目录下自己使用安装命令进行安装：

# 进入项目根目录
$ cd myApp

# 使用 yarn 安装依赖
$ yarn

# OR 使用 npm 安装依赖
$ npm install

# OR 使用 pnpm 安装依赖
$ pnpm install

# OR 使用 cnpm 安装依赖
$ cnpm install

如果npm install 还是安装失败，就将node_modules文件夹删除后重新 npm install (我就是这样解决的)

目录结构

编译运行

使用 Taro 的 build 命令可以把 Taro 代码编译成不同端的代码，然后在对应的开发工具中查看效果。

Taro 编译分为 dev 和 build 模式：

• dev 模式（增加 --watch 参数） 将会监听文件修改。
• build 模式（去掉 --watch 参数） 将不会监听文件修改，并会对代码进行压缩打包。
• dev 模式生成的文件较大，设置环境变量 NODE_ENV 为 production 可以开启压缩，方便预览，但编译速度会下降。

我这边用支付宝小程序举例，使用其他小程序可以去官网详细了解：

编译命令：

# yarn
$ yarn dev:alipay
$ yarn build:alipay

# npm script
$ npm run dev:alipay
$ npm run build:alipay

# 仅限全局安装
$ taro build --type alipay --watch
$ taro build --type alipay

# npx 用户也可以使用
$ npx taro build --type alipay --watch
$ npx taro build --type alipay

# watch 同时开启压缩
$ set NODE_ENV=production && taro build --type alipay --watch # CMD
$ NODE_ENV=production taro build --type alipay --watch # Bash

使用npm run dev:alipay将Taro编译成支付宝小程序代码

$ npm run dev:alipay

小程序开发者工具​

下载并打开支付宝小程序开发者工具，然后选择项目根目录下 dist 目录（根目录 config 中的 outputRoot 设置的目录）进行预览。

需要注意开发者工具的项目设置：

• 需要关闭 ES6 转 ES5 功能，开启可能报错
• 需要关闭上传代码时样式自动补全，开启可能报错
• 需要关闭代码压缩上传，开启可能报错

 打开支付宝小程序，点击右上角打开项目，选择根目录下的dist目录就可以进行预览，注意dist目录为编译文件不可修改，编写代码在src目录下的文件。

 快捷创建页面

使用命令可以快速创建页面模版代码：

$ taro create --name <页面名称>