微信小程序开发目录结构介绍

2018/4/12 19:02:59
摘要: 在进行微信小程序开发的时候,有一个固定的默认的目录结构,该结构中包含一个app(主体部分)和多个page(页面),其中分别有四种文件类型

在进行微信小程序开发的时候,有一个固定的默认的目录结构,该结构中包含一个app(主体部分)和多个page(页面),其中分别有四种文件类型,详细介绍如下:

1、目录结构

test

 ├─ page

 │ └─ index

 │  ├─ index.js

 │  ├─ index.json

 │  ├─ index.wxml

 │  └─ index.wxss

 ├─ app.js

 ├─ app.json

 └─ app.wxss

2、目录结构详细介绍

 (1)项目文件介绍

.js后缀的文件是脚本文件,实现页面的交互等代码;

.json后缀的文件是配置文件,主要用于json数据格式存放与设置程序的配置效果;

.wxss后缀的是样式表文件,类似前端css,用于界面美化;

.wxml后缀的文件是页面结构文件,用于构建页面与页面上控件的增加。

 (2)app主体部分介绍

app是用来描述整体程序的,由.js、.json、.wxss文件组成。.js后缀的是脚本文件,.json后缀的文件是配置文件,.wxss后缀的是样式表文件,它们都必须放在项目根目录中。

app.js是小程序的必要的脚本代码,在这个文件中可以监听并处理小程序的生命周期函数、声明全局变量,并调用框架为开发提供的丰富的 API。

app.json是对整个小程序运行中必须的全局配置,用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多tab等。它所接受每一个数组中每一项都是字符串,来指定小程序由哪些页面组成。微信小程序中的每一个页面的“路径+页面名”都必须写在app.json的pages中,并且pages中的第一个页面是小程序的首页。

app.wxss是整个小程序的公共样式表,不同于app.js与app.json的必须性,它是非必须的存在。

(3)page页面介绍

page是用来描述页面,一个页面由.js、.json、.wxss、.wxml四个文件组成,即每一个小程序页面都是由同路径下同名的四个不同后缀文件的组成。比如首页的index,它的纹面组成就是index.js、index.wxml、index.wxss、index.json。.js后缀的文件是脚本文件,.json后缀的文件是配置文件,.wxss后缀的是样式表文件,.wxml后缀的文件是页面结构文件。

index.js 是必须的页面脚本文件,在这个文件中我们可以监听并处理页面的生命周期函数、获取小程序实例,声明并处理数据,响应页面交互事件等。

index.wxss是非必须的页面样式表文件,当有页面样式表时,页面的样式表中的样式规则会层叠覆盖app.wxss中的样式规则。如果不指定页面的样式表,也可以在页面的结构文件中直接使用app.wxss中指定的样式规则。

index.json是非必须页面配置文件,当有页面有指定的页面配置文件时,配置项在该页面会覆盖app.json的window中相同的配置项。如果没有指定的页面配置文件,则在该页面直接使用app.json中的默认配置。

  文末,小编顺便说下两个需要注意的点,一是为了为了方便开发者减少配置项,小程序规定描述页面的四个文件必须具有相同的路径与文件名;二是小程序提供了丰富的API,开发者可根据需求选择,具体网址为https://mp.weixin.qq.com/debug/wxadoc/dev/api/?t=201715。


声明:文章"微信小程序开发目录结构介绍"为互诚科技—微信小程序开发公司的原创文章,转载请注明出处,谢谢合作!
标签:运营技巧
电话咨询:13119592416(高生)
在线留言:
微信扫码,关注我们
相关文章
  • 小程序开发文档:生命周期函数与页面事件函数说明

    微信小程序开发过程中必要遇到的两个内容,就是生命周期函数与页面相关事件处理函数,而者两个内容

  • 微信小程序开发文档之API场景值ID说明

    微信小程序的开发,其中场景值的使用,是便于管理后台获取用户来源数据,以便进行渠道分析

  • 小程序入驻商城系统开发,踏入电商领域第一步

    在电子商务飞速的时代,电商不再是趋向三国鼎立格局,而是各种平台各自发展却又暗自较劲。

  • 关于微信小程序兼容性相关问题浅析

    微信小程序官方开发者,在对其功能的不断升级过程中,会有新的组件以及API被发布,但是新的内容一般只会支持新版本、高版本

  • 企业着手微信小程序开发运营的前景如何?

    微信小程序的开发运营,其本身就是立足于微信这个平台的基础上来谈论公司企业乃至个人运营小程序的前景

  • 微信小程序开发如何精准地抓住用户

    不管是开发微信小程序,还是开发其他的微信产品,开发后能帮助管理者精准抓住用户才能算是开发取得成效