⚡ 30 秒速记

• 跨端由编译工具、运行时与平台适配共同完成
• 早期模板转换与后续运行时架构分开理解
• 统一组件和接口仍受宿主能力限制
• 数据同步、节点规模与包体影响性能
• 各目标端分别构建、预览和真机验证

Taro 通过编译和运行时适配，让同一套业务逻辑尽量复用到不同平台。 早期方案大量把界面语法转换成目标模板，后续架构增加运行时适配来支持更灵活的框架行为，因此语法限制必须结合主版本看。组件与接口可以统一常见用法，宿主权限、生命周期和渲染能力却不会凭空相同。跨端交付仍要逐端验证，并关注包体和界面同步成本。

版本校准： 原理文章中的代码代表特定实现与写作时间。应用到当前项目时，应先确认浏览器、框架或工具的主版本，再区分稳定的规范语义、可变化的内部实现和项目自身约束。

一、Taro 的安装与使用

1.1 安装

$ npm install -g @tarojs/cli

taro -V

1.2 使用

使用命令创建模板项目

$ taro init myApp

1.2.1 微信小程序

选择微信小程序模式，需要自行下载并打开微信开发者工具，然后选择项目根目录进行预览

微信小程序编译预览及打包

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

1.2.2 百度小程序

选择百度小程序模式，需要自行下载并打开百度开发者工具，然后在项目编译完后选择项目根目录下 dist 目录进行预览

百度小程序编译预览及打包

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

1.2.3 支付宝小程序

选择支付宝小程序模式，需要自行下载并打开支付宝小程序开发者工具，然后在项目编译完后选择项目根目录下 dist 目录进行预览

支付宝小程序编译预览及打包：

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

1.2.4 H5

H5 编译预览及打包：

# npm script
$ npm run dev:h5

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

1.2.5 React Native

React Native 端运行需执行如下命令，React Native 端相关的运行说明请参见 React Native 教程

# npm script
$ npm run dev:rn

1.3 更新 Taro

Taro 提供了更新命令来更新 CLI工具自身和项目中 Taro 相关的依赖。

更新 taro-cli 工具

# taro
$ taro update self
# npm

更新项目中 Taro 相关的依赖，这个需要在你的项目下执行

$ taro update project

二、Taro 开发说明与注意事项

2.1 微信小程序开发工具的配置