美文网首页
小程序云开发代码结构

小程序云开发代码结构

作者: 泡杯感冒灵 | 来源:发表于2021-01-04 11:25 被阅读0次

根目录结构

image.png
  • cloudfunctions文件夹是当前小程序云开发的云函数的部分。我们云函数的代码会写到这个文件夹下。
  • miniprogram文件夹是小程序前端代码的部分

miniprogram下的components文件夹是放自定义组件的。
miniprogram下的images是放图片资源的
miniprogram下的styles是放的是一些自带的样式文件
miniprogram下的pages是放的对应的小程序页面代码
小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。一个小程序主体部分,由三个文件构成


image.png
image.png
app.js

每个小程序都需要在app.js中,调用App方法注册小程序实例,绑定生命周期回调函数,错误监听和页面不存在监听函数等。

//app.js
App({
  onLaunch: function () {
    if (!wx.cloud) {
      console.error('请使用 2.2.3 或以上的基础库以使用云能力')
    } else {
      wx.cloud.init({
        // env 参数说明:
        //   env 参数决定接下来小程序发起的云开发调用(wx.cloud.xxx)会默认请求到哪个云环境的资源
        //   此处请填入环境 ID, 环境 ID 可打开云控制台查看
        //   如不填则使用默认环境(第一个创建的环境)
        env: 'my-env-id',
        // 通过配置traceUser我们可以访问到,当前哪些用户访问过我们的小程序,设置为true,会把每个访问的用户都记录到云开发控制台中,并以倒序的方式去显示。
        traceUser: true,
      })
    }
     // globalData 可以用来放全局属性和全局方法
    this.globalData = {}
  }
})

整个小程序,只有一个App实例,开发者可以通过getApp方法获取到全局唯一的App实例,从而获取App上的数据或者调用开发者注册在App上的函数

// xxx.js
cosnt appInstance = getApp()
console.log(appInstance.globalData)
app.json

用来对微信小程序进行全局配置,决定页面文件的路径,窗口的表现,设置网络超时时间,设置多tab等;
每个页面也都有一个json文件,来对本页面的窗口表现进行配置,页面中的json配置项,会覆盖app.json中window的配置项

app.wxss全局样式
sitemap.json 配置其小程序页面是否允许微信索引
project.config.json 当前小程序的项目配置文件,是开发者工具配置相关的。

相关文章

网友评论

      本文标题:小程序云开发代码结构

      本文链接:https://www.haomeiwen.com/subject/xbwmoktx.html