小程序（二） 一个简单的“欢迎”页面

小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。如图2-1所示

一个小程序主体部分由三个文件组成，必须放在项目的根目录，如图2-2所示

一个小程序页面由四个文件组成，如图2-3所示

注意：为了方便开发者减少配置项，描述页面的四个文件必须具有相同的路径与文件名。

创建项目启动页，如图2-4所示：

新建一个空白项目，点击 图2-5所示 “+” 创建小程序主体部分的三个文件及pages文件夹，在pages文件夹下新建一个index文件夹，如图2-5所示，选中pages文件夹 右键 新建目录

在index文件夹下创建 index.wxml 、index.wxss 、index.js 、index.json 四个文件。

注：除 顶级 目录文件/文件夹使用 图2-5 中的 “+” 创建外，其他文件创建选中其上级目录文件夹 右键 新建目录/文件

创建好文件后，在app.json中写入：

编辑 index.wxml 文件，此处会用到图片，需在顶级目录创建images文件夹用来存放图片：

模拟器的机型设置为 iPhone6 ，小程序以IPhone6的屏幕尺寸为设计标准，像素使用 rpx 为单位，编辑 index.wxss 文件：

若使小程序呈现 图2-4 的效果，需编写 app.json 文件：

项目出现如图2-6 所示错误：

编写index.js：

启动页面就完成了 ^ _ ^

1、点击手机桌面“微信”图标，进入手机“微信”。

2、接下来需要点击右下角“我”，进入“个人页面”。

3、点击“设置”，进入“设置页面”。

4、接下来需要点击“通用”，进入“通用设置”。

5、点击“发现页管理”，向下滑动找到点击“小程序”后面的按钮。

6、将其设置为“打开”，返回微信发现页，即可看到“小程序”入口。

若使用的是vivo手机，进入微信--发现--小程序--点开某个小程序--右上角三点图标，即可选择将该微信小程序添加到桌面。

另外，需要进入i管家--（应用管理/软件管理）--权限管理--桌面快捷方式，允许微信创建桌面快捷方式。

---