1.小程序基础
配置文件 组件样式 事件系统 wxml语法 生命周期 小程序API 自定义组件 分包加载
开放能力 教程通信 npm支持
2.文件和目录介绍
一个完整的小程序分为两个部分 主体文件 （全局文件） 放到项目的根目录下
页面文件
主体文件由app.js（必须存在） app.json（必须存在） app.wxss组成
页面文件 是每个页面所需的文件 放在 pages目录下 一个页面一个文件夹 4个文件
.js 页面逻辑（必）
.wxml 页面结构（必）
.wxss 页面样式
· .json小页面配置
3.小程序的渲染模式2种
skyLline 最新的渲染模式，还不是很成熟
webview 切换此模式 方法 打开app.json文件 renderer rendererOptions componentFeamework 去掉 保存
4.新建页面
pages文件夹 右击 -->新建文件夹 -->新建page--->list (不需要后缀) 回车 出来四个文件
打开app.json文件 pages数组 ---> 复制路径 更改路径
5.小程序调试基础库
微信开发者工具中，可以选择微信基础库版本
微信基础库指的是小程序的运行环境，给小程序提供了运行所需要的各种API和工具，以及基础框架和运行逻辑
调试基础库：
打开微信开发者工具 -->详情 设置（微信分享朋友圈要求基础库最低是2.1.3）
6.调试小程序代码
工具栏 点击 调试器：
Whtml 调试结构 样式
console 打印js 有系统的和自己打印，可以在系统打印处右击-->隐藏
NetWork 网络
AppData 当前页面的数据
storage 查看本地存储的数据
工具栏的按钮
转圈-->刷新按钮 若重新编译模拟器没有更新，点击刷新按钮
预览-->继续预览-->二维码
清缓存---需要常请缓存 或者重启
7.配置文件
json是一种轻量级的数据格式，常用于前后端的交互，在小程序中，json扮演着配置项的角色，
用于配置项目或者页面属性和行为，每个页面或组件也有一个对应的json文件
小程序中常见的配置文件
1.app.json 小程序的全局配置文件，用于配置小程序的一些全局属性和页面路由
2.页面.json 小程序的页面的配置文件，用于配置当前页面窗口样式，页面标题
3.project.config.json 小程序项目的配置文件，用于保存项目的一些配置信息和开发者的个人设置
4.siltemao.json 配置小程序及器页面是否允许被微信索引，提高小程序在搜索引擎搜索到的概率
8.全局配置 -pages配置
pages字段：用来指定小程序由哪些页面组成，用于让小程序知道由哪些页面组成以及页面定义在 那个目录，每一项都对应一个页面的路径
数组 路由信息
配置pages字段注意事项：
1.页面路由不需要写文件后缀，框架会自动去寻找对应的位置的四个文件进行处理
2.小程序中新增或减少页面，都需要对pages数组进行修改
3.未指定entryPagePath时，数组的第一项代表小程序的初始页面（首页）
9.全局配置项 window
window 字段 用于设置小程序的状态栏 导航条 标题 窗口背景色
官方文档 window配置项 微信官方文档---小程序
修改当前项目的状态栏 导航条
打开app.json进行配置
把window中的配置项去掉 可以根据文档中window中包含的配置项进行配置 "..."："..."
导航条 navi...
导航条背景色 navi....
配置下拉开启 第一个 ：true, 可以进行下拉 ，（可以下来才能显示窗口）
backgroundTextStyle设置窗口的背景色 --light(亮色)-dark(暗色)还有一个亮色
10全局配置tabBar配置
tabBar 建议小程序顶部 /底部tab栏，用于页面间快速切换
tabBar 指定tab表现，以及tab切换时显示对应页面（borderStyle backgroundColor
selectedColor list selectediconPath pagePath iconPath text color）
注意：tab按数组顺寻排序，list配置最少2个，最多5个tab
app.json 创建4个页面 再配置tabBar
tabBar:{
'selectedColor':'#f3154f',
'color':#666'',
'bacgroundColor':'#efefef',
'borderStyle':'black',
position:'top'，（tabBar在顶部）bottom在底部
'list':[{'text':'购物车'，'pagePath'：'pages/cart/cart','iconPath':'/assets/tabbar/cart.png','selectedIconPath':"/assets/tabbar/cart-active.png"},{},{}]}
11.小程序的页面配置
小程序的页面配置，也成为局部配置，每一个小程序页面也可以使用自己的.json文件，来对本页面的窗口进行配置
注意： 页面配置的属性跟全局配置window属性一致，只是不需要额外指定window字段，页面配置项会覆盖全局配置项
16.项目配置文件和配置sass
在创建项目的时候，每个项目的根目录生成来两个config.json文件，用于保存开发者在工具上做的个性化配置，例如和编译有关的配置，当重新安装微信开发者工具或换电脑工作时，只要载入同一个项目的代码包，开发者工具就会自动回复到当时开发项目的个性化配置。
project.config.json和project.private.cnfig.json文件都可以对项目进行配置
project.config.json：项目配置文件，常用进行配置公共的配置------写与最终编译有关的设置
project.private.cnfig.json:项目私有配置，常用配置个人的配置 ----->写到gitlgnore避免冲突
17.配置文件 sitemap.json
sitemap.json文件:配置小程序及其页面是否允许被微信索引，提高小程序在微信内部被用户搜索到的概率
微信已开放小程序的搜素，开发者可以通过sitemap.json配置设置小程序页面是否允许微信索引。当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引，当用户的搜索词条触发该索引时，小程序的页面将可能展示在搜索结果中
注意：
1.没有sitemap.json则默认所有页面都能被索引
2.{"action":"allow","page":"*"}是优先级最低的默认规则，未显示指明"disallow"都默认被索引
先到app.json 属性 "sitemapLocation"："sitemap.json"--->找到文件sitemap.json文件
sitemap.json文件中属性"rules":[] 数组，
"rules":[{'action':'allow','page':'*'}] -----默认的规则
"rules":[{'action':'disallow','page':'pages/index/index'}]----首页不被允许索引
"rules":[{'action':'allow','page':'pages/index/index'}]----只有首页被允许索引
18.小程序的样式和组件介绍
在开发web网站的时候，页面结构由html进行编写，例如用到标签div，p,span,img ,a标签
页面的样式由css进行编写，例如常用.class,#id，element等选择器
但在小程序中不能使用html标签，也没有DOM bom ,css也仅仅是支持部分选择器，
小程序提供了WXML进行页面进行填写，同时提供了WXSS进行页面样式
wxml 提供了view text image navigator 等标签来构建页面结构，只不过小程序将标签称为组件
wxss对css扩充和修改，新增了尺寸单位rpx,提供了全局的样式和局部样式 ，另外需要注意wxss仅支持部分css选择器
19.样式-尺寸单位rpx
手机屏幕不同，为了使开发项目在不同手机展示一样，需要开发者对不同屏幕配置，用px不能实现，也就用到了rpx
rpx ：是小程序新增的自适应单位，它可以根据不同设备的屏幕宽度进行自适应缩放
小程序规定任何手机型号手机 屏幕宽度为750rpx,
点击路径进入 cart.js文件 关闭cart.js 点开cart.xml，点开cart.sass文件
在cart.xml文件中写上需求 1.建立一个盒子，2.在盒子占一半
用view (类似div是块级 ，加上class 名)
在cart.sass用.class{ width:xxrpx;height:xxrpx；bacgroundColor:red} ---rpx可以自适应（小程序规定不论何种型号手机，手机屏幕都是750rpx）
开发建议：
1.开发微信小程序时，设计师可以用iphone6作为视觉的标准，iphone6的设计搞一般为750px
2.如果用iphone6作为视觉稿的标准，量取多少px,直接写多少rpx即可，开发起来更方便，也能适用屏幕的宽度，设计稿宽度时750px，而iphone6的设备宽375px,设计稿想完成展示手机中，就需要缩小一倍，在iphone6下，px和rpx的换算关系，1rpx=0.5px，750rpx=375px ,刚好填满整个屏幕的宽度
20样式 全局样式 局部样式
网页开发中的全局样式在global.css base.css 或者reset.css作为全局样式问津进行重置样式或统一 每个页面或组件中的样式为局部样式
小程序的全局样式在app.wxss 作用每一个页面 例如设置字号/背景色/宽高等全局样式
小程序的局部样式 在page.wxss定义规则，作用在对应页面，会覆盖app.wxss全局对应样式
app.css引进了sass,转换成app.sass
app.sass中含有.container的样式 再写 text{color：lightseagreen;font-size：50rpx}
cart.sass页面也部署text中color,fontsize ,覆盖了app/sass中样式
- 小程序的常用组件
1.view组件 2.swiper和swiper-item组件 3.image组件
4.text组件 5.navigator组件 6.scroll-view组件 7.字体组件
案例： index.wxml中注释和view
index.sass用page{.........加页面的样式}
22.组件案例-轮播图
小程序中比较哦简单，
swiper:滑块视图容器。其中只能放swiper-item组件