微信小程序（1）

---

前言

小程序是一种不需要下载、安装即可使用的应用，它实现了触手可及的梦想，用户扫一扫或者搜一下就能打开应用，也实现了用完即走的理念，用户不用安装太多应用，应用随处可用，但又无须安装卸载。

---

一、简介

什么是小程序：
小程序是一种不需要下载、安装即可使用的应用，它实现了触手可及的梦想，用户扫一扫或者搜一下就能打开应用，也实现了用完即走的理念，用户不用安装太多应用，应用随处可用，但又无须安装卸载。​

微信公众平台，点击链接按步骤填好信息后即可注册小程序开发账号。
开发工具下载：开发者工具

二、小程序与普通网页开发的区别

1. 运行环境

• 网页运行在浏览器环境中
• 小程序运行在微信环境中

2. API不同

由于运行环境不同，小程序中，无法调用 DOM 和 BOM 的 API，但是，小程序中可以调用微信环境提供的各种 API，例如：

• 地理定位
• 扫码
• 支付

3. 开发模式不同

网页的开发模式：浏览器 + 代码编辑器

小程序有自己的一套标准开发模式

• 申请小程序开发账号
• 安装小程序开发者工具
• 创建和配置小程序项目

4. 标签不同

网页标签：div、span、img等

小程序标签：view、text、image等

三、小程序的代码构成

1. 项目目录基本组成

1. pages 用来存放所有小程序的页面
2. utils 用来存放工具性质的模块（例如：格式化时间的自定义模块）
3. app.js 小程序项目的入口文件
4. app.json 小程序项目的全局配置文件
5. app.wxss 小程序项目的全局样式文件
6. project.config.json 项目的配置文件
7. sitemap.json 用来配置小程序以及页面是否允许被微信搜索到

2. 小程序页面的组成部分

每个页面由 4 个基本文件组成，他们分别是：

1. .js 文件 – 页面的脚本文件，存放页面的数据、事件处理函数、生命周期等
2. .json 文件 – 当前页面的配置文件，配置页面的外观、表现等
3. .wxml 文件 – 页面的模板结构文件
4. .wxss 文件 – 当前页面的样式表文件

4. 小程序中的4中配置文件

小程序中的 json 文件，一般都是配置文件

JSON 是一种数据格式，在实际开发中，JSON 总是以配置文件的形式出现。小程序项目也不例外，通过不同的 .json 配置文件，可以对小程序项目进行不同级别的配置。小程序项目中有 4 中 json 文件，分别是：

1. 项目根目录中的 app.json 配置文件
2. 项目根目录中的 project.config.json 配置文件
3. 项目根目录中的 sitemap.json 配置文件
4. 每个页面文件夹中的 .json 配置文件

• app.json
  
  简单了解下这 4 个配置项的作用：

1. pages：用来记录当前小程序所有页面的路径
2. window：全局定义小程序所有页面的背景色、文件颜色等
3. style：全局定义小程序组件所使用的样式版本
4. sitemapLocation：用来指明 sitemap.json 的位置

• project.config.json 文件
  project.config.json 是项目配置文件，用来记录我们对小程序开发工具所做的个性化配置，例如：

1. setting 中保存了编译相关的配置
2. projectname 中保存的是项目名称
3. appid 中保存的是小程序的账号 ID

• sitemap.json 文件
  微信现已开放小程序内搜索，效果类似于 PC 网页的 SEO （搜索引擎优化），sitemap.json 文件用来配置小程序页面是否允许微信搜索。
  当开发者允许微信搜索时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索关键字和页面的索引匹配成功的时候，小程序的页面将可能展示在搜索结果中。

• 页面的 .json 配置文件
  小程序中的每一个页面，可以使用 .json 文件来对本页面的窗口外观进行配置，页面中的配置项会覆盖 app.json 中的 window 中的配置项

---

总结

All that ends well is well.