@[toc]
小程序代码的构成-项目结构
了解项目的基本组成结构
pages用来存放小程序的页面
utils用来存放工具性质的模块
app.js小程序项目的入口文件
app.json小程序项目的全局配置文件
app.wxss小程序项目的全局样式文件
project.config.json项目的配置文件
sitemap.json用来配置小程序及其页面是否允许被微信索引
小程序页面的组成部分
pages：
.js文件（页面的脚本文件，存放页面的数据、事件处理函数）
.json文件（当前页面的配置文件，配置窗口的外观、表现等）
.wxml文件（页面的模板结构文件）
.wxss文件（当前页面样式表文件）
小程序代码的构成-JSON配置文件
JSON配置文件的作用
JSON是一种数据格式，在实际开发中，JSON 总是以配置文件的形式出现。小程序项目中也不例外：通过不同的.json配置文件，可以对小程序项目进行不同级别的配置。
app.json文件
app.json是当前小程序的全局配置，包括小程序的所有页面路径、窗口外观、界面表现、底部tab等。
Demo项目里边的app.json配置如下：
pages: 用来记录当前小程序所有页面的路径
window： 全局定义小程序所有页面的背景色、文字颜色等
style： 全局定义小程序组件所使用的样式版本--- v2表示最新版本
sitemapLocation： 用来指明sitemap.json的位置
project.config.json文件
project.config.json是项目配置文件，用来记录我们对小程序开发工具所做的个性化配置，例如：
setting中保存了编译相关的配置
projectname中保存的是项目的名称
appid中保存的是小程序的账号ID
sitmap.json文件
微信现在已开放小程序内搜索，效果类似于PC网页的SEO。sitemap.json文件用来配置小程序页面是否允许微信索引。
当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索关键字和页面的索引匹配成功的时候，小程序的页面将可能展示在搜索结果中。
页面的.json配置文件
小程序中的每一个页面，可以使用.json文件对本页面的窗口外观进行配置，页面中的配置项会覆盖app.json的window中相同的配置项。例如：
新建小程序页面
只需要在app.json->pages中新增页面的存放路径，小程序开发者工具即可帮助我们自动创建对应的页面文件，如图所示：
修改项目首页
只需要调整app.json->pages数组中页面路径的先后顺序，即可修改项目的首页。小程序会把排在第一位的页面，当作项目首页进行渲染。
小程序代码的构成-WXML模板
什么是WXML
WXML 是小程序框架设计的一套标签语言，用来构建小程序页面的结构，其作用类似于网页中的HTML。
WXML 和HTML的区别
标签名：
view = div
text = span
image = img
navigator = a
属性节点不同
<navigator url = "pages/home/home"></navigator> 等价于<a href = "#"></a>
提供了类似于Vue中的模板语法
数据绑定
列表渲染
条件渲染
小程序代码的构成-项目结构
了解项目的基本组成结构
pages用来存放小程序的页面
utils用来存放工具性质的模块
app.js小程序项目的入口文件
app.json小程序项目的全局配置文件
app.wxss小程序项目的全局样式文件
project.config.json项目的配置文件
sitemap.json用来配置小程序及其页面是否允许被微信索引
小程序页面的组成部分
pages：
.js文件（页面的脚本文件，存放页面的数据、事件处理函数）
.json文件（当前页面的配置文件，配置窗口的外观、表现等）
.wxml文件（页面的模板结构文件）
.wxss文件（当前页面样式表文件）
小程序代码的构成-JSON配置文件
JSON配置文件的作用
JSON是一种数据格式，在实际开发中，JSON 总是以配置文件的形式出现。小程序项目中也不例外：通过不同的.json配置文件，可以对小程序项目进行不同级别的配置。
app.json文件
app.json是当前小程序的全局配置，包括小程序的所有页面路径、窗口外观、界面表现、底部tab等。
Demo项目里边的app.json配置如下：
扫一扫
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
