微信小程序从入门到飞起(环境搭建、配置)
目錄
一、什么是微信小程序
二、官方微信小程序體驗
三、環境搭建
3.1.注冊賬號
3.2.下載開發工具
3.3.創建工程
四、話不多說,開始
4.1.開發工具還是很簡潔方便的
4.2.微信小程序的文件名稱
4.3.基本項目目錄
4.4.小程序的配置文件
4.4.1.全局的app.json
4.4.2.頁面的page.json
一、什么是微信小程序
官網:https://developers.weixin.qq.com/miniprogram/dev/framework/
相信沒人會不知道什么是微信小程序吧(略)
二、官方微信小程序體驗
三、環境搭建
3.1.注冊賬號
點擊?https://mp.weixin.qq.com/wxopen/waregister?action=step1?根據指引填寫信息和提交相應的資料,就可以擁有自己的小程序帳號。
注意:一個郵箱只能注冊一次,而且時間久了就會被禁用,而且找不回。(我就是時間久了給我禁用了,無奈之下換了個新的郵箱注冊)
登錄?https://mp.weixin.qq.com?,我們可以在菜單 “設置”-“開發設置” 看到小程序的?AppID?了 。
(注意:不注冊的話也是可以用的,開發試用有一些限制)
3.2.下載開發工具
微信提供免費的小程序開發工具,下載鏈接如下:
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
第一次打開開發工具,需要微信掃碼登錄。
3.3.創建工程
在這里輸入appID,如果沒有也可以試用,但是試用的話會有一些限制。
如果在開發過程中想要修改appId,可以在這里修改:
四、話不多說,開始
4.1.開發工具還是很簡潔方便的
4.2.微信小程序的文件名稱
微信小程序同普通的web開發大同小異,其文件名也不是html、css,而是WXML、WXSS,具體配置是用json進行配置的。
具體差異如下:
4.3.基本項目目錄
4.4.小程序的配置文件
一個小程序會包括兩種配置文件,一種是全局的app.json,和頁面自己的page.json。 注意:配置文件中不允許出現注釋!4.4.1.全局的app.json
app.json是當前小程序的全局配置,包括了頁面路徑、界面的表現形式、底部tab、網絡超時時間、是否開啟debug模式。
其中pages的第一個頁面,就是小程序的首頁。
具體如下(不能寫注釋哦):
官網:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html
{"pages": ["pages/index/index","pages/logs/index"],"window": {"navigationBarTitleText": "Demo"},"tabBar": {"list": [{"pagePath": "pages/index/index","text": "首頁"}, {"pagePath": "pages/logs/logs","text": "日志"}]},"networkTimeout": {"request": 10000,"downloadFile": 10000},"debug": true }4.4.2.頁面的page.json
除了全局的app.json配置外,還可以用.json文件對小程序項目中的每一個頁面進行配置,但只能設置本頁面的window配置項的內容,頁面.json文件中的window配置值將覆蓋app.json中的配置值。 具體配置示例如下: 官網:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html {"navigationBarBackgroundColor": "#ffffff","navigationBarTextStyle": "black","navigationBarTitleText": "微信接口功能演示","backgroundColor": "#eeeeee","backgroundTextStyle": "light" }?
總結
以上是生活随笔為你收集整理的微信小程序从入门到飞起(环境搭建、配置)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 这是我见过解释java内部类最详细的一篇
- 下一篇: 微信小程序从入门到飞起(各个组件)