1. 提前准备

• 安装npm（包管理工具）
• 安装WebStorm（代码编辑器）
• 安装微信开发者工具（界面展示）

2. 安装Taro

2.1 安装命令

进入Taro官方文档，选择想要使用的版本，选择安装方式(本文使用npm)。

直接使用这个命令安装会安装最新的4.x版本，可以在上图中的命令后面添加版本号安装指定的版本：

npm install -g @tarojs/cli@3.6.28

2.2 查看/卸载Taro

使用如下命令可以查看npm的全局安装。

npm list --depth 0 -g

使用如下命令可以卸载Taro

npm uninstall -g <package>

3. Taro使用

3.1 新建项目存放文件夹

在本机想要存放项目的位置建立一个空文件夹，进入文件夹后，在当前位置打开cmd窗口。

3.2 初始化项目

使用如下命令初始化项目。

taro init 项目名

等待拉取模板资源。

拉取模板成功后，选择 taro-ui作为使用的模板。

3.3 使用WebStorm打开项目（MyTest目录下生成的项目名目录）

使用其他编辑器，如VS Code也是可以的。

打开项目后，WebStorm提示安装依赖，点击确认即可自动安装相关依赖。

可能会报如下错误：

根据错误提示，在命令行使用如下命令重新安装依赖：

npm install --force

3.4 运行项目

打开package.json文件，找到 “dev:weapp” ，点击绿色的运行按钮，点击Run

显示如下内容表示项目启动成功

接着打开微信开发者工具，导入当前项目。

选择当前项目路径，AppID选择测试号，后端不使用云服务，点击创建即可。

点击编译，即可看到默认的界面。

3.5 其他配置

1. 全局格式配置，使用Taro-UI需要进行这个配置，不然组件效果可能不能正常显示。

import 'taro-ui/dist/style/index.scss'

之后根据需要到 Taro-UI 或者 Taro官方文档 找到需要的组件进行开发即可。