微信小程序提供的格式四不像,上手成本高。京东凹凸实验室开发出的Taro框架基于React语法,可以多终端使用:微信小程序、支付宝小程序、字节跳动小程序、H5、RN。
不过最主要的还是适应微信小程序。
本次实战使用Taro开发一个穿搭衣服的微信小程序,使用Taro UI库。
第一章从基本的配置环境,
安装Taro:
# 使用 npm 安装 CLI$ npm install -g @tarojs/cli# OR 使用 yarn 安装 CLI$ yarn global add @tarojs/cli# OR 安装了 cnpm,使用 cnpm 安装 CLI$ cnpm install -g @tarojs/cli创建新项目:
$ taro init myApp本次配置不使用TypeScript、使用Less、默认模板。
安装Taro UI:
npm install taro-ui --save在src下的app.js中全局引入组件样式,添加:
import 'taro-ui/dist/style/index.scss'OK!
基本已经配置完毕,可以使用小程序预览模式,边修改边观察页面变化,需下载好微信开发者工具。
打开微信开发者工具,
在项目中输入:
# npm script$ npm run dev:weapp# 仅限全局安装$ taro build --type weapp --watch# npx用户也可以使用$ npx taro build --type weapp --watchTaro会编译为微信小程序的文件格式,并保存在dist目录下,使用微信开发者工具打开dist目录,即可预览小程序页面。
Taro开发微信小程序-登录实现(二)
Taro开发微信小程序-用户授权(三)
Taro开发微信小程序-TabBar实现(四)













