Taro教程-微信app开发实践-01开发环境建设

目前，微信小程序的开发者大约有几百万（我还没有统计）。在这数百万人中，有些是使用本地小程序语法开发的，有些是利用第三方转码框架开发的，如mpvue（a group）、taro（a east），其他未知框架未列出。据说，一滴水还打开了一个有趣的童鞋来学习。

以上不是重点。关键的一点是，我总是使用本地小程序语法进行开发。所以当我写这个教程时，我不知道是谁给了我勇气。也许是梁静茹！我希望它能支持我将整个开发过程完美地呈现给所有的童鞋。

为什么是太郎？

因为我第一次接触的MVVM框架是React Js，所以有一种莫名其妙的亲密关系，这只是原因之一。

另一个原因是我喜欢Taro的多终端处理能力。请参见下面的官方介绍。

Taro是一个遵循React语法规范的多终端开发解决方案。如今，有各种形式的高端市场。Web、React Native、微信小程序等终端很受欢迎。当业务需求同时在不同端表达时，为不同端编写多组代码的成本显然非常高。此时，只编写一组代码以适应多个目的的能力是非常必要的。

有了Taro，我们只能编写一组代码，然后通过Taro的编译工具单独编译源代码，该工具可以在不同的端（微信/百度/支付宝/字节跳动小程序、H5、React Five等）运行。

不管这位官员吹嘘得多么厉害，那都是一头骡子或一匹马拉出来散步！

01项目结构

事实上，微信小程序的发展是前端和后端分离的典型表现。现在前端已经选择了React Js（Taro），我们使用PHP在后端提供API接口。

这里，我们使用PhalAPI来提供接口数据服务。事实上，我更擅长YII2。

以上的项目结构基本上足以满足一般小程序的需求。当然，对于一些具有大量数据和高并发场景的小程序，后端服务相当复杂，所以我们在这里就不提了。

02开发工具

想要做好工作的工人必须首先磨砺工具！这里我使用vscode开发小程序，使用php开发php。

03环境建设

首先，建立了Taro环境。现在许多前端项目都基于节点。js的npm执行包管理，因此先决条件是安装节点js，运行npm命令没有问题。由于一些众所周知的原因，一些开发包下载速度较慢。我通常使用cnpm安装软件包。如果我不明白，我会去百度！

安装和使用

安装Taro开发工具@tarojs/cli

使用npm或yarn进行全局安装，或直接使用npx

$npm安装-g@tarojs/cli

$yarn全局添加@tarojs/cli

使用

使用命令创建模板项目

$taro初始化我的app

微信小程序

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

微信小程序的编译预览和打包（移除——watch不会听文件修改，会压缩和打包代码）

#npm脚本

$npm运行dev:weapp

$npm运行构建：weapp

#仅全局安装

$taro build--类型weapp--手表

$taro构建--类型weapp

项目的实际代码如下：

微信公众号：老付波码

用taro命令创建项目后，用vscode打开项目Miai。在vscode终端下运行命令npm Run dev:weapp

微信公众号：老付波码

项目运行时，通过微信开发工具打开Miai，可以看到小程序正在运行。

微信公众号：老付波码

搜索微信公众号：老付波代码回复号1001，获取完整教程和代码仓库地址

关注微信公众号：老付波码

老人密码