✨✨ 欢迎大家来到景天科技苑✨✨
🎈🎈 养成好习惯，先赞后看哦~🎈🎈
1.创建微信小程序项目
1.1 创建项目流程（开发者）
1.获取 小程序id
- 小程序后台–》开发–》开发管理–》开发设置–》开发者ID
- AppID(小程序ID) wxxxxxxxxxxxf
2.下载微信开发者工具–》这个工具必须联网才能使用
- 下载地址：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
3.一路下一步安装–》桌面有个快捷方式
- 微信开发者工具就等同于 pycharm
选择安装目录
安装完成，会生成桌面图标
1.2 创建项目
1.双击 微信开发者工具
2.微信扫码–》登录
扫码登录成功
3.创建项目
- 点加号创建项目
- 填写名字
- 路径
- APPID
- 不使用云开发【使用腾讯云的云函数，服务器等等，需要花钱】
- 不使用模版
- 可以选择js基础版–》别的别选了
- JS：咱们不会
- 其他模版功能比较复杂对新手不友好
点确定
4.基础设置
- 设置–》编辑器设置–》改变字体大小
- 视图–》外观–》移动模拟器位置
- 可以勾选掉不显示：模拟器，调试器等
1.3 本地开发支持http
本地开发–》使用django写后端
- django运行在 0.0.0.0:8000 地址
- 微信小程序才能通过ip地址访问到我们的django项目的接口
- 微信小程序默认不支持http–》django运行在http上–》修改一下–》微信小程序配置
- 让小程序支持 http请求
- 右上角–》详情–》本地设置–》不校验合法域名
2.项目目录结构
2.1 项目目录结构
2.1.1 目录介绍
1.项目主配置文件，在项目根路径下，控制整个项目的
- app.js # 小程序入口文件，小程序启动，会执行这个js
- app.json # 小程序的全局配置：顶部的颜色，标题。。。
- app.wxss # 小程序全局样式：所有样式，全局生效
app.js 和app.json 必须有，没有不行
2.页面文件
- pages文件夹下，有一个个的文件夹（index,login,register）–>每个文件夹下有4个文件
- xx.js # 页面逻辑，js代码控制
- xx.wxml # 页面结构，布局，html—》wxml就等同于html，但标签有些区别
- xx.json # 页面配置，当前页面顶部颜色，标题。。
- xx.wxss # 页面的样式，如果全局样式也有，以当前页面为准
xx.js和xx.wxml 必须得有，不能没有
3.其他的不重要
├── components 【页面中使用的组件】
├── pages 【页面文件目录】
│ ├── index 【页面】
│ │ ├── index.js 【页面JS】
│ │ ├── index.json 【页面配置】
│ │ ├── index.wxml 【页面HTML】
│ │ └── index.wxss 【页面CSS】
│ └── logs 【页面】
│ ├── logs.js …
│ ├── logs.json …
│ ├── logs.wxml …
│ └── logs.wxss …
├── utils 【自定义工具】
│ └── utils.js 【功能的定义】
├── app.js 【全局JS】
├── app.json 【全局配置】
├── app.wxss 【全局CSS】
├── project.config.json 【开发者工具默认配置】
├── project.private.config.json 【开发者工具用户配置,在这里修改，优先用这个，可以删除】
├── .eslintrc.js 【ESlint语法检查配置】
├── sitemap.json 【微信收录页面，用于搜索，上线后，搜索关键字就可以搜到我们】
2.1.2 配置文件
2.1.2.1 项目配置app.json
1.小程序全局配置文件，用于配置小程序的一些全局属性和页面路由,默认标题，顶部颜色，是否有下拉刷新。。
2.配置参考地址
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html
3.部分参数演示
entryPagePath：小程序默认启动首页
pages: 小程序总共有多少个页面
2.1.2.2 页面配置 xx.json
1.小程序页面配置文件，也称局部配置文件，用于配置当前页面的窗口样式、页面标题等
2.app.json 中的部分配置，也支持对单个页面进行配置，可以在页面对应的 xx.json 文件来对本页面的表现进行配置。
3.页面中配置项在当前页面会覆盖 app.json 中相同的配置项（样式相关的配置项属于 app.json 中的 window 属性，但这里不需要额外指定 window 字段），具体的取值和含义可参考全局配置文档中说明
4.参考文档：
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html
5.常用的
navigationBarBackgroundColor # 导航栏背景颜色，如 #000000
navigationBarTextStyle # 导航栏标题、状态栏颜色，仅支持 black / white
navigationBarTitleText # 导航栏标题文字内容
2.1.2.3 整个项目配置文件
1.project.config.json project.private.config.json
project.config.json 和右上角详情里面的设置是联动的
2.小程序项目的配置文件，用于保存项目的一些配置信息和开发者的个人设置
3.project.private.config.json项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段
4.参照文档
https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html
2.1.2.4 搜索相关配置（seo）
1.作用
微信现已开放小程序内搜索，开发者可以通过 sitemap.json 配置，或者管理后台页面收录开关来配置其小程序页面是否允许微信索引。
当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索词条触发该索引时，小程序的页面将可能展示在搜索结果中。
爬虫访问小程序内页面时，会携带特定的 user-agent：mpcrawler 及场景值：1129。需要注意的是，若小程序爬虫发现的页面数据和真实用户的呈现不一致，那么该页面将不会进入索引中
2.参考文档
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/sitemap.html
3.配置–》以后用户搜索小程序，任意页面有关键字，都会被搜索到
{
“desc”: “关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html”,
“rules”: [{
“action”: “allow”,
“page”: “*”
}]
}
微信小程序开发工具的使用，各个配置文件详解，小程序开发快速入门（二）：https://developer.aliyun.com/article/1497344
