新星计划｜记录安装Nodejs和HBuilderX搭建、部署微信小程序开发环境（一）

1 前言

大项目是关于【ChatGPT+UniApp小程序全栈开发】，本文是总结归纳搭建和部署uniapp开发环境，感谢导师陶人超有料的分享：
https://blog.csdn.net/weixin_37797592/article/details/127138438

2 注册小程序账号

于微信公众平台网址：https://mp.weixin.qq.com/，右上角点击立即注册

选择点击左下角小程序

正常填入信息注册即可，注意，如果注册有公众号的邮箱不可用于注册小程序，因此需备多一个邮箱，常见的gmail、QQ、网易的126，163都可

然后按提示登录邮箱点击链接激活即可

随后扫码登录，进入到开发管理-开发设置-开发者ID，点击生成，记得复制保存好密钥

3 安装微信开发者工具

在微信开发者工具下载网址：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html，找到下载稳定版Stable Build

• windows 根据自己的电脑情况安装64位或者32位，一般都是64位
• macos 英特尔芯片的下载x64，M1或M2芯片的下载ARM64

笔者用的是OS，正常安装即可，windows用户默认选项安装即可，安装路径记得修改，不装C盘，不装C盘，不装C盘

打开后扫码登录能顺利进入界面即可

4 安装Nodejs和HBuilderX

HBuilderX是DCloud公司推出的一款全新的Web开发集成环境，主要用于前端开发、后端开发和移动应用开发。它支持HTML/CSS/JavaScript等前端技术开发，同时也支持PHP、Java、Node.js等后端语言开发，还提供了Hybrid App开发、微信小程序开发功能。HBuilderX集成了代码编辑器、调试器、编译器、版本管理等多个开发工具，能够大大提高开发效率。此外，HBuilderX还支持插件扩展，用户可以通过安装插件来扩展各种功能，满足不同的开发需求

4.1 windows用户安装Nodejs

环境这里选择搭建Nodejs，Nodejs下载网址：https://nodejs.cn/download/

大家根据自己的情况下载安装即可

windows的环境配置大家查看原文：https://blog.csdn.net/weixin_37797592/article/details/127138438

4.2 macos/linux用户安装Nodejs

可以跟4.1一样在网站上下载安装，也可用homebrew安装

# 安装node
brew install node

# 检查版本，若有返回版本号即安装成功
node -v
npm -v

相关的路径

# 查找homebrew的路径
brew list git

# homebrew路径
/opt/homebrew/

# 通过homebrew安装的软件的文件夹
/opt/homebrew/Cellar

# npm安装包存放的位置
/usr/local/lib/node_modules/npm

# npm全局下载模板的存放位置
/usr/local/lib/node_modules/npm/node_module

因为npm服务器在海外，对下载速度有一定影响，因此可以换一下镜像源或者安装cnpm

# 更换成淘宝源
npm config set registry https://registry.npm.taobao.org

# 使用cnpm工具取代npm：
npm install -g cnpm --registry=https://registry.npm.taobao.org

4.3 安装HBuilder X

进入HBuilder X官网：https://dcloud.io/hbuilderx.html，根据自己的电脑选择下载内容，版本用正式版即可

5 创建项目

5.1 新建一个项目

在左上角文件-新建-项目

选择uni-app，有很多现成模版，也可以自行选择

5.2 进行基本配置

生成uni-app应用标识和应用名称

根据图片勾选和配置微信小程序，填入的AppID是第一步申请保存复制的id

6 HBuilderX同步微信开发者工具

6.1 打开服务端口

打开微信开发者工具，设置-安全设置，打开服务端口

6.2 调用微信开发者工具

回到HBuilderX，在运行-运行到小程序模拟器-微信开发者工具

现在HBuilderX可以成功调起微信开发者工具，完成同步，实现实时查看内容修改了