文章来源于快应用官方论坛-本文作者“小立吗?”
「 Taro 」(https://taro.jd.com)一套遵循 React 语法规范的移动端跨平台统一解决方案,使用 Taro,只要维护一套代码,Taro 就能生成对应端的代码。目前支持 8 端(快应用 / 微信 / 支付宝 / 百度 / 字节跳动 / QQ小程序 / H5 / RN)转换。
安装
Taro 项目基于 node,请确保已具备较新的 node 环境(>=8.0.0),推荐使用node 版本管理工具 nvm来管理 node,这样不仅可以很方便地切换 node 版本,而且全局安装时候也不用加 sudo 了。
cli 工具安装
首先,你需要使用 npm 或者 yarn 全局安装@tarojs/cli,或者直接使用npx:
1. # 使用 npm 安装 CLI
2. $ npm install -g @tarojs/cli
3. # OR 使用 yarn 安装 CLI
4. $ yarn global add @tarojs/cli
5. # OR 安装了 cnpm,使用 cnpm 安装 CLI
6. $ cnpm install -g @tarojs/cli
安装好 Taro cli 成功之后,可以使用 taro init 创建模版项目,假设项目叫 myApp 则如下:
1. $ taro init myApp
输入以上命令后,Taro 会以问答的形式进行技术的选型,大家按照自己的技术栈和喜好进行选择,选择到最后一步会提供一些模版供你选择,如下图:
选择了某个模版以后,它会帮你安装依赖,如图:
如果安装成功则如下图:
如果时间比较长也没有安装成功,也可以进入 myApp 目录,使用 npm i 手动安装。
编译成快应用
选择快应用模式,使用下面的命令编译代码:
1. # yarn
2. $ yarn dev:quickapp
3. $ yarn build:quickapp
4. # npm script
5. $ npm run dev:quickapp
6. $ npm run build:quickapp
7. # 仅限全局安装
8. $ taro build --type quickapp --watch
9. $ taro build --type quickapp
10. # npx 用户也可以使用
11. $ npx taro build --type quickapp --watch
12. $ npx taro build --type quickapp
以上命令是对快应用进行编译预览及打包(去掉 --watch 将不会监听文件修改,并会对代码进行压缩打包),下载并打开快应用开发者工具,选择「打开文件文件夹」或者「 Open folder 」
接着找到 myApp 目录下的 dist 目录,点击「 打开 」
打开 dist 目录后,将看到导进来的 myApp 项目了,怎么预览呢?点击左边的预览图标(图上箭头的那个眼睛),然后就出现如右边红色方框里的预览效果啦。
选择 vs code 进行开发,打开 myApp 目录。
代码目录
在 myApp 跟目录下有如下文件夹,其中 src 是源代码,dist 是编译以后的文件(也就是 IDE 刚才选择打开的文件夹)
打开 dist 目录,会包含sign、src、build、dist 等几个文件夹如下:
其中 sign 文件夹是签名模块,当前仅有debug签名,如果内测上线,请添加release文件夹,增加线上签名;签名生成方法详见文档使用命令行,发布前打包;
src 文件夹是项目源文件夹;
dist 文件夹则是点了“眼睛”图标后IDE生成的二进制文件。
以上只是简单的介绍了一下 Taro 开发快应用的入门,更多信息可查阅我们的文档,或者加入社区来了解。
关于我们:
· Taro 官网:https://taro.jd.com/
· Taro 物料市场:https://taro-ext.jd.com/
· Taro 开发者社区:https://taro-club.jd.com/
扫码关注,敬请期待快应用更多精彩内容!
快应用生态平台