微信小程序1——# 小程序项目结构##

小程序项目结构

1、项目的基本组成结构

· pages用来存放所有小程序页面

· utils用来存放工具性质的模块

· app.js 小程序入口文件

· app.json 小程序的全局配置

· app.wxss 小程序的全局样式文件

· project.config.json 项目的配置文件

· sitemap.json 是否允许被微信检索

2、页面组成部分

.js 页面脚本文件，存放页面数据、事件处理函数

.json 当前页面的配置文件，窗口外观、表现等

.wxml 页面的模板结构文件

.wxss 页面的样式表文件

3、json配置文件

json大多以配置文件的形式出现

3.1、app.json 全局配置文件

· pages：记录当前小程序所有页面的路径

· window：全局定义小程序背景色、文字颜色

· style：全局定义小程序组件的样式版本——v1&v2（全新样式）

· sitemapLocation：指定sitemap.json 的位置

3.2、project.config.json小程序开发工具个性化配置

· setting与编译相关的配置

· projectname 项目名称

· appid 小程序账号id

3.3、sitemap.json

是否允许被微信索引，通过爬虫建立索引

3.4、.json

页面中的配置项会覆盖app.json的window中相同的页面配置——页面级别覆盖全局配置

3.5 调整项目首页

可以通过调整app.json中pages页面的顺序调整首页

4、wxml 模板

wxml，微信框架设计的标签语言，用来构建页面结构

· 与HTML的区别

标签名称不同（view，text，image，navigator）

属性节点不同（< navigator url="">超链接 < /navigator>）

提供了类似于Vue的模板语法（数据绑定，列表渲染，条件渲染）

5、wxss

· 与CSS区别

新增 rpx 尺寸单位

提供全局样式和局部样式

wxss仅支持部分CSS选择器（类选择器，id选择器，element，::after和::before等伪类选择器，大部分支持）

6、.js 文件

6.1 分类

· app.js——是整个小程序项目的入口文件，通过调用App（）函数来启动整个小程序

· 页面的.js文件——页面的入口文件，通过Page（）来创建并运行页面

· 普通的.js 文件——封装公共函数或属性