您的位置:首页 > 教育 > 锐评 > 大型网站建设建站模板_网站备案流程详细_私密浏览器免费版_北京网络推广公司

大型网站建设建站模板_网站备案流程详细_私密浏览器免费版_北京网络推广公司

2025/5/24 6:12:08 来源:https://blog.csdn.net/qq_41611586/article/details/147126365  浏览:    关键词:大型网站建设建站模板_网站备案流程详细_私密浏览器免费版_北京网络推广公司
大型网站建设建站模板_网站备案流程详细_私密浏览器免费版_北京网络推广公司

阶段 0 – 环境就绪(超详细版)

目标:把本地开发环境、云端资源和版本管理都准备好,并打上 v0.1‑init Tag,为后续 1‑5 阶段奠定基础。


1. 硬件 & 软件准备

项目版本建议说明
操作系统Win 10+/macOS 12+/Linux微信开发者工具已支持三大平台(Linux 需 AppImage)
Node.js≥ 18 LTS方便后续使用 npm 脚本、云函数本地调试
Git≥ 2.40版本管理 + 打 Tag
微信开发者工具Stable Build 1.06.x建议稳定版,功能完整且 bug 少 citeturn4search0

2. 安装微信开发者工具

  1. 打开官方下载页(工具内含模拟器与 IDE):
    https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
    选择 Stable Build,按系统下载并安装。citeturn4search1
  2. 启动工具 → 使用 微信扫码登录(须与小程序后台同一微信号或被授权的体验者)。
  3. 勾选 “同意并发送匿名数据” 可选;保持默认插件即可。

3. 申请 / 绑定 AppID

情况建议做法
有营业执照在微信公众平台 → 小程序创建小程序,获取正式 AppID
个人练习进入开发者工具 → 无 AppID → 选择「测试号」,系统会分配临时 AppID

⚠️ 测试号仅供开发调试,发布前需换成正式 AppID,否则无法上线。


4. 创建云开发环境

  1. 在开发者工具顶部菜单点击 云开发 → 根据提示 开通云开发
  2. 选择计费方式:按量计费(默认免费额度足够学习)。
  3. 创建环境时命名为 canteen-prod(正式)或 canteen-dev(测试),记下 环境 ID
  4. 首次开通后需等待约 10 分钟,后台才会完成初始化,否则调用 API 会报 invalid scope。citeturn2search0

5. 初始化项目骨架

  1. 新建项目
    • 开发者工具首页 → + → 选择 云开发快速启动模版空白项目
    • 目录建议:~/workspace/canteen-miniapp
  2. 推荐目录结构(空白项目):
    canteen-miniapp/
    ├─ miniprogram/          # 前端
    │   ├─ pages/
    │   ├─ components/
    │   └─ utils/
    ├─ cloudfunctions/       # 云函数
    ├─ .gitignore
    └─ project.config.json
    
  3. 项目详情 → 云开发设置 中,确认默认环境已指向第 4 步创建的环境 ID。

6. Git 版本库 & 首个 Tag

cd ~/workspace/canteen-miniapp
git init
echo ".DS_Store\nnode_modules\n/miniprogram/npm\ncloudfunctions/*/node_modules" > .gitignore
git add .
git commit -m "chore: init project skeleton"
git tag v0.1-init
git remote add origin git@github.com:<your‑name>/canteen-miniapp.git
git push -u origin main --tags

7. 上传示例菜品图片(云存储)

  1. 云开发控制台 → 存储,创建文件夹 dishes/
  2. 上传 3‑5 张示例菜图(命名如 dish01.jpg)。
  3. 复制其中一张的 临时链接,在 miniprogram/pages/index/index.json 里测试绑定,确保能正常显示。

8. 运行 & 本地测试

  • 点击 编译 按钮(或 Cmd/Ctrl + B)查看模拟器效果。
  • 右键项目根目录 → 在终端中打开,执行 npm install vant-weapp -S(后续阶段 1 会用到)。

9. 阶段里程碑检查

  • ✅ 微信开发者工具可正常编译并预览空白页面。
  • ✅ 云开发环境 ID 正确、可在「数据库」「存储」看到资源。
  • ✅ GitHub/Gitee 上出现 v0.1‑init Tag。
  • ✅ 项目目录与 .gitignore 设置完成。

完成以上步骤,即宣告 阶段 0 – 环境就绪 结束。接下来可切 git checkout -b feat/menu,进入 阶段 1 – 菜单浏览 的开发。祝编码愉快!

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com