安装前先准备三样东西
开始安装前,确认手头有:小程序源码包(通常为 zip)、微信开发者工具、已注册的小程序 AppID。源码包一般包含 pages、components、app.json 等文件,解压后放在一个没有中文和空格的路径下,例如 D:\work\miniprogram。
AppID 在小程序后台「开发管理-开发设置」中查看。没有 AppID 也能用测试号预览,但无法上传发布。
导入模板到开发者工具
打开微信开发者工具,选择「小程序」项目类型,点击「+」新建项目。
- 项目名称:自定义,不影响运行
- 目录:选择解压后包含
app.json的那一层文件夹 - AppID:粘贴自己的 AppID
- 后端服务:新手选「不使用云服务」,除非模板说明需要云开发
点击确定后工具会自动编译。若提示找不到 app.json,说明目录选错了一层,退回上一级重新选择。
修改模板的基础配置
模板能跑起来后,先改这几处,避免带着原作者信息上线。
替换 AppID 与项目名
在 project.config.json 中检查 appid 是否与后台一致。不一致会导致真机预览失败。
修改全局样式与导航
打开 app.json,调整 window 里的 navigationBarTitleText(标题)、navigationBarBackgroundColor(导航栏颜色)。这些是用户第一眼看到的内容。
替换图片与接口地址
模板中的示例图、占位图放在 images 或 static 目录,直接替换同名文件即可。接口地址通常在 config.js 或 utils/request.js 中,改成自己的域名,并在小程序后台「开发设置-服务器域名」里配置合法域名。
预览、真机测试与上传
点击工具栏「预览」,用微信扫码在手机上查看。重点检查:页面跳转是否正常、图片是否加载、按钮点击是否有反应。
确认无误后点击「上传」,填写版本号和备注。上传成功后到小程序后台「版本管理」提交审核。审核通过后点击「发布」,模板才真正对用户可见。
常见报错与排查
- 编译报错
app.json未找到:目录层级选错,重新选择根目录。 - 真机白屏:多为接口域名未配置或使用了
http而非https。 - 组件找不到:模板依赖的 npm 包未构建,在工具中执行「工具-构建 npm」。
- 样式错乱:基础库版本过低,在「详情-本地设置」中调高调试基础库版本。
按以上步骤操作,大多数小程序模板都能在半小时内跑通。遇到问题优先看控制台报错行号,再对照模板自带的说明文档排查。

