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

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(高生)
在线留言:
微信扫码,关注我们
相关文章
  • 电商小程序做内容社群营销,如何实现变现?

    微信小程序开发成电商平台的形式去上线运营,但这并不代表着它就只能成为一个完完全全的电商平台去利用,它依旧可以做内容营销

  • 开发与运营小程序时必须了解的五个实际性问题

    无论是网络建站还是微信开发,在正是进行开发工作之前,需求者都需要花费一些心思去了解自己所要开发的产品的基础而又必须的资讯。拿微信小程序开发来讲

  • 微信小程序的开发与运营,学习哪些主要知识?

    当企业商家或者个人组织在准备开发微信小程序之前,就需要考量一下自己对这方面是否有一定的了解,这样无论是自己开发运营还是代开发运营,都能让自己明了地掌握一些实时情况,不至于一头雾水甚至被坑蒙拐骗。所以一些主要的知识还是需要学习了解一下,包括有以下两个方面:

  • 微信的未来,是否要靠微信小程序开发来支撑?

    对于微信公众号的开发现状,虽然没有大势已去的凄凉,但确实企业商家以及个人用户

  • 引爆市场的微信小程序开发是怎么样的?

    在微信小程序面世之初,在很多人还对其非常不了解的时候,就已经有一款小程序在短时间内成为业界爆款,这种引爆市场的开发运营形式我们可以学习借鉴

  • 微信小程序实施卡券营销有什么好处

    商家开发微信小程序平台作为电商平台使用,可以通过开发微信卡券功能,去自定义设置符合营销需求的卡券类型进行投放营销