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/ 目录中

相关推荐
UIUV7 小时前
模块化CSS学习笔记:从作用域问题到实战解决方案
前端·javascript·react.js
用户12039112947267 小时前
使用 Tailwind CSS 构建现代登录页面:从 Vite 配置到 React 交互细节
前端·javascript·react.js
杨进军7 小时前
模拟 Taro 实现编译多端样式文件
前端·taro
阿珊和她的猫8 小时前
React Hooks:革新组件开发的优势与实践
前端·react.js·状态模式
hxjhnct9 小时前
React useContext的缺陷
前端·react.js·前端框架
说私域10 小时前
短视频私域流量池的变现路径创新:基于AI智能名片链动2+1模式S2B2C商城小程序的实践研究
大数据·人工智能·小程序
栀秋66611 小时前
智能驱动的 Git 提交:基于 Ollama 大模型的规范化提交信息生成方案
react.js·llm·ollama
毕设源码-邱学长12 小时前
【开题答辩全过程】以 基于微信小程序的松辽律所咨询系统的设计与实现为例,包含答辩的问题和答案
微信小程序·小程序
晚风予星12 小时前
简记 | 一个基于 AntD 的高效 useDrawer Hooks
前端·react.js·设计
+VX:Fegn089514 小时前
计算机毕业设计|基于springboot + vue物流配送中心信息化管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·小程序·课程设计