React+Taro创建小程序

第一步:首先确认是否安装Node.js和npm

如果已安装Node.js和npm,以下可以查询

javascript 复制代码
node -v
npm -v

第二步:安装Taro CLI

javascript 复制代码
npm install -g @tarojs/cli

第三步:创建项目

javascript 复制代码
taro init my-react-taro-app

然后可以看到,下图

第四步:进入到根目录

cd my-react-taro-app 安装依赖,个人建议使用cnpm,也可以使用npm。

javascript 复制代码
cnpm install

项目目录

第五步:启动到开发服务器

你可以通过以下命令启动不同平台的开发模式:

启动到微信小程序,之后可以在根目录看到dist文件,直接用微信开发者工具打开就可以预览效果。

javascript 复制代码
npm run dev:weapp

启动H5 开发环境

javascript 复制代码
npm run dev:h5

第六步:构成生产版本

当你准备发布时,可以使用以下命令进行构建:

复制代码
npm run build:h5

或构建微信小程序:

复制代码
npm run build:weapp

构建后的文件会放在 dist/ 目录中

相关推荐
2601_963869959 小时前
力序健身房管理系统
微信小程序·小程序
狗狗狗狗狗乐啊10 小时前
搭一个 AI 对话工作台 AChat:从 0 到可用的完整记录(一)
python·react.js·ai编程
一 乐12 小时前
二手交易平台|基于springboot + vue二手交易平台(源码+数据库+文档)
java·数据库·vue.js·spring boot·小程序
微擎应用市场17 小时前
鲸飞云 PMS 系统 —— 现代化酒店运营的智能管理解决方案
小程序
疯狂小猫咪21 小时前
教务管理系统课时消课模块设计思路
大数据·小程序
晓得迷路了21 小时前
栗子前端技术周刊第 147 期 - React Router 8.4、Vite 云服务攻击、pnpm 12.4...
前端·javascript·react.js
meiying88381 天前
微信商城小程序怎么开发?2026 从店铺架构到下单链路的技术选型拆解
小程序
扶风ff2 天前
练题簿小程序:家庭在线练题,课后复习更简单
学习·小程序
神秘的猪头2 天前
React 脱围机制(二):重新理解 useEffect——它不是生命周期,而是同步外部系统
react.js
卡布鲁2 天前
React useMemo 与 useCallback 完全指南:原理、场景与避坑
前端·react.js