微信小程序开发工具的目录结构

1、四个基本文件（由四个文件最终编译成一个完整页面）

1  .js文件：页面脚本文件，存放页面数据、事件处理函数等。——处理用户操作

•  app.js文件：整个项目的入口文件，通过调用App（）函数启动项目。
•  页面.js文件：页面入口文件，调用Page（）函数，创建并运行页面。
• 普通.js文件：普通功能模块文件，用来封装公共的函数或属性供页面使用。

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

3 .wxml文件：页面的模板结构文件。（WXML模板类网页HTML）

4 .wxss文件：当前页面的样式表文件。（WXSS：一套样式语言，用于描述WXML局部或全局的组件样式，类网页CSS）

 

 

---

2、一个项目的基本目录结构

 

• pages：【文件夹】存放所有小程序的页面

  • index文件—首页文件

  • logs文件—日志文件

• utils：【文件夹】用来存放工具性质模块[如：格式化时间的自定义模块]

• app.js:项目入口文件

• app.json:项目全局配置文件 

  • pages——页面路径[在此输入“pages/list/list”则工具自动创建新页面、替换其中数组的顺序可修改项目的首页]

  • window——全局定义所有页面样式

  • style——全局定义小程序组件所使用的样本

  • sitemapLocation——指明sitemap.json的位置

 

• app.wxss:项目全局样式文件

• project.config.json:项目的配置文件

  • setting——保存编译相关的配置【与右侧的本地设置同步】

  • project name——项目名称 ≠ 小程序名称

  • appid——小程序账号ID

 

• sitemap.json:用来配置小程序及其页面是否允许被微信索引[利用“allow”或“disallow”配置当前页面是否被微信搜索]

---

3、宿主环境（IOS、Android）小程序是依托手机微信，小程序宿主环境包含以下四大类：

1.通信模型

通信主体：渲染层（WXML、WXSS）、逻辑层（JS脚本）

通信模型：渲染层与逻辑层之间通信、逻辑层与 第三方服务器之间通信

 2.运行机制

         启动过程：

小程序代码包本地下载——>解析app.json文件——>执行app.js入口文件，调用App（）函数创建小程序实例——>渲染小程序首页——>启动完成

        页面渲染过程：

加载解析页面.json文件——>加载页面的.WXML和.WXSS——>执行页面.js文件，调用Page（）函数创建页面实例——>完成渲染

3.组件（官方分为九大类组件）

视图容器、基础内容、表单组件、导航组件、媒体组件、map地图组件、canvas画布组件、开放能力、无障碍访问

4.API

• 事件监听API：以on开头，用来监听某些事件触发。
• 同步API：以Sync结尾，其执行结果可以通过函数返回值直接获取，若执行出错会抛出异常。
• 异步API：类似于jQuery中$.ajax(options)函数，需要通过success、fail、complete接收调用结果。