微信小程序购物商城系统的开发之目录结构的介绍1

微信小程序购物商城系统的开发之目录结构的介绍

微信小程序，简称小程序，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。小程序是一种不用下载就能使用的应用，也是一项门槛非常高的创新，经过将近两年的发展，已经构造了新的小程序开发环境和开发者生态。

这篇文章主要介绍了微信小程序购物商城系统开发系列-目录结构介绍，有兴趣的可以了解一下。

上一篇我们简单介绍了一下微信小程序的IDE(微信小程序购物商城系统开发系列-工具篇)，相信大家都已经蠢蠢欲试建立一个自己的小程序，去完成一个独立的商城网站。

先别着急我们一步步来，先尝试下写一个自己的小demo.

这一篇文章我们主要的是介绍一下小程序的一些目录结构，以及一些语法，为我们后面的微信小程序商城系统做铺垫。

首先我们来了解下小程序的目录结构
微信小程序购物商城系统的开发之目录结构的介绍
Pages 我们新建的一些页面将保存在这个文件夹下面，每一个小程序页面是由同路径下同名的四个不同后缀文件的组成，如：index.js、index.wxml、index.wxss、index.json。.js后缀的文件是脚本文件，.json后缀的文件是配置文件，.wxss后缀的是样式表文件，.wxml后缀的文件是页面结构文件。

Utils 我们写的一些公共的工具js可以放里面。

app.js 是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API，如本例的同步存储及同步读取本地数据。微信小程序购物商城系统的开发之目录结构的介绍
app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成，配置小程序的窗口背景色，配置导航条样式，配置默认标题。

{

 "pages":[

  "pages/index/index",

  "pages/logs/logs"

 ],

 "window":{

  "backgroundTextStyle":"light",

  "navigationBarBackgroundColor": "#fff",

  "navigationBarTitleText": "WeChat",

  "navigationBarTextStyle":"black"

 }

}

注：app.json中是对整个小程序的全局设置，当然每个页面也有自己的json文件。每个页面下的json文件只能对window 进行设置，所以页面json文件下只需写入window的配置即可

{ "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "WeChat", "navigationBarTextStyle":"black" }