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

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。


声明:文章"微信小程序开发目录结构介绍"为互诚科技—微信小程序开发公司的原创文章,转载请注明出处,谢谢合作!
标签:小程序开发文档
电话咨询:18011971195(黄先生)
在线留言:
微信扫码,关注我们
相关文章
  • 广州企业微信开发后的营销信息推送误区

    企业开发微信后就需要去进行运营,利用运营去做产品营销,来带动企业的发展。

  • 微信小程序运营必须双向互动、多向传播

    微信小程序开发的难度是APP的六分之,所要考虑的开发问题也比较简单,所以相比起开发一个APP,小程序的开发就显得简单得多

  • 广州微信小程序开发需要注意哪些细节

    站在广州微信小程序开发公司的立场来看,作为一个给需求者提供开发服务的公司,想要获得行业口碑以此来得到更多企业商家的青睐

  • 初次创业者做微信小程序开发时需要注意什么

    初次创业者在做小程序开发时,一些关乎于成本、发展前景的问题就需要去着重注意,毕竟对于一个刚刚

  • 开发了微信小程序,广州企业怎么去推广最有效?

    每一个互联网产品开发出来之后,首先需要考虑到的就是产品的推广。不过每个产品由于自己的特点形式与依存平台的不一样,所以推广的方式也会有些不同。那微信小程序与APP相比,正是因为小程序有着自己的特色与规则,所以推广方式基本就与APP不同了。此外,每一个推广方式的效果基本也是不相同的,以小程序为例

  • 小程序开发文档:生命周期函数与页面事件函数说明

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