小程序原生框架开发文档，从开发到上线

小程序开发相关地址

官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/
申请小程序帐号:https://mp.weixin.qq.com/
安装开发工具:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
小程序后台:https://mp.weixin.qq.com/

小程序环境区分

目前官方并没有出相关的api供开发者使用，网上部分人是__wxConfig.envVersion，此方案部分基础库会取消，不兼容，所以目前只能通过手动切换环境的方法来执行不同的代码。但需要谨慎的是，上线提审前需要记得重新手动切换环境。没有切换环境，不会影响接口（因为目前小程序接口是会根据DNS自动调用不同环境的接口），但是会影响埋点。

小程序项目结构

pages->页面
app.js全局js
app.json全局配置
app.wxss全局样式
project.config.json项目配置
sitemap.json页面收录配置

小程序导入项目

微信开发者工具，选择导入，选择项目文件夹，选择“不使用云服务”（新版微信开发者工具会默认使用微信云开发）

小程序新建页面

例：需要新建一个页面，hello，先在pages文件夹下新建文件夹index，然后在index文件夹右键选择新建page，就会自动生成同名的4个文件

小程序更新机制

非常重要的一步,如果需要开发新的小程序，第一期必须加,否则后期将出现用户必须删除小程序重新进入才能更新的情况，（需要使用wx.getUpdateManager这个api，可参考下面这个方法，需要在onLaunch或者在首页onShow等生命周期执行这个方法，保证每次用户进入小程序后能够调用）

  // 小程序检查/更新版本
  checkUpdateVersion() {
    // 检测是否可以调用getUpdateManager检查更新
    if (!wx.canIUse("getUpdateManager")) return
    //创建 UpdateManager 实例
    const updateManager = wx.getUpdateManager()
    //检测版本更新
    updateManager.onCheckForUpdate(function (res) {
      // 请求完新版本信息的回调
      if (res.hasUpdate) {
        //监听小程序有版本更新事件
        updateManager.onUpdateReady(function () {
          wx.showModal({
            title: '更新提示',
            content: '新版本已经准备好，是否重启应用？',
            success(res) {
              if (res.confirm) {
                // 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
                updateManager.applyUpdate()
              }
            }
          })
        })

        updateManager.onUpdateFailed(function () {
          // 新版本下载失败
          wx.showModal({
            title: '已经有新版本咯~',
            content: '请您删除当前小程序，到微信 “发现-小程序” 页，重新搜索打开呦~',
          })
        })
      }
    })
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

小程序域名配置

• 在小程序开发过程中，可以使用开发者工具，选择不校验域名，进行开发，但是建议刚开始开发项目时不使用这个功能，将遇到的错误域名记录起来统一配置

• ps：由于域名配置每月有限制次数，其中服务器域名每月支持修改50次（以前是5次），每类服务器域名最多可添加200个）。业务域名以前也是有限制次数的，现在没有了

• 服务器域名包含服务器域名（wx.request），socket合法域名，uploadFile合法域名（没记错的话应该是wx.uploadFile），downloadFile合法域名（没记错的话应该是wx.downloadFile/wx.saveImageToPhotosAlbum），udp合法域名，udp合法域名。具体需要配置在哪个域名，可根据错误提示配置。

• 业务域名：配置为业务域名后，可调用web-view组件在小程序中打开，也就是小程序嵌入的H5页面的域名。配置域名业务需要该域名放置一个指定文件，需要找运维配合。

  
  

小程序版本

开发版:开发中,微信开发者工具直接扫码预览效果即为开发版,需要有小程序的开发者权限才能预览
体验版:在开发中工具中右上角菜单中上传代码后,在小程序后台中,可以选择某个版本为体验版,有小程序的开发者权限/体验者即可扫码体验版二维码预览
正式版:发布后的小程序

小程序开发流程

开发阶段
可通过微信开发者工具直接调试 或者 微信开发者工具–预览–二维码预览
注意点：开发过程中，如果新增的域名需要配置，需要在后台配置好，并且确认域名是否和测试/线上域名一致，不一致的话，还需要同时配置测试/线上域名，防止提测或者提审的时候因为域名导致的错误。

测试阶段
修改为测试环境，通过微信开发者工具，右上角点击上传，上传成功后，打开小程序后台–版本管理–开发版本–选择对应的版本的下箭头–选为体验版本–点击对应版本号下面的二维码发给测试人员，并在成员管理中把测试人员的微信添加为体验成员

上线阶段
（修改为正式环境，通过微信开发者工具，右上角点击上传，上传成功后，打开小程序后台–版本管理–开发版本–选择对应的版本–提交审核–已提审）目前腾讯的审核进度还是蛮快的，基本都是当天或者第二天就有审核结果了。
审核通过后，打开小程序后台–版本管理–审核版本–选择对应的版本–发布–全量发布–上线完成
审核不通过，根据不通过的结果，调整代码或者流程（也可能是服务类目不符合等），重新提交审核，等待审核结果

开发建议

This指向
app.js的this改成app（即最外层定义app，onLaunch中app = this，在app.js中所有方法直接使用app替换this）
page的this改成that（即最外层定义that，onLoad中that= this，在app.js中所有方法直接使用that替换this）
page获取app实例，命名为app（即const app = getApp()）
原因是，在开发的过程中，当某个方法重复性使用时，需要将page中的方法直接抽离到app.js公共使用，此时可以直接将方法搬过去，方法中包含页面的this或者app实例也无需改变