一、注冊

訪問微信公眾平臺，將鼠標(biāo)的光標(biāo)置于賬號分類中的小程序上，

點擊‘查看詳情’

點擊“前往注冊”

下方也可以點擊注冊：

小程序注冊頁面：
步驟a:進(jìn)入小程序注冊頁，根據(jù)指引填寫信息和提交相應(yīng)的資料，完成賬號申請。
注意：
每個郵箱僅能申請一個小程序。
作為登錄賬號，請?zhí)顚?code>未被微信公眾平臺注冊，未被微信開放平臺注冊，未被個人微信號綁定的郵箱。

也可以 創(chuàng)建測試號，免注冊快速體驗小程序開發(fā)。立即申請

了解更多：開發(fā)輔助/測試號

為方便開發(fā)者開發(fā)和體驗小程序、小游戲的各種能力，開發(fā)者可以申請小程序或小游戲的測試號，并使用此賬號在開發(fā)者工具創(chuàng)建項目進(jìn)行開發(fā)測試，以及真機預(yù)覽體驗。
申請測試號的過程非常簡單。只需訪問 申請地址 ，并使用微信掃描二維碼，即可獲得為自己分配好的小程序和小游戲測試賬號。

步驟b:使用申請的微信公眾平臺賬號登錄小程序后臺，單擊開發(fā) > 開發(fā)管理>開發(fā)設(shè)置，可以看到小程序的AppID(小程序的唯一標(biāo)識)，請記錄AppID，后續(xù)操作中需要使用。
小程序后臺：

AppSecret(小程序密鑰)可以點擊生成，只有第一次能夠查看（需要復(fù)制粘貼保存下來），后面出于安全考慮，AppSecret不再被明文保存，忘記密鑰請點擊重置：

步驟c: 在開發(fā)設(shè)置 > 服務(wù)器域名 > request合法域名中填入您的已備案域名(此處可以暫時不操作)。
使用 微信云開發(fā) 或 微信云托管 ，無需配置服務(wù)器域名，省心省力。如業(yè)務(wù)訪問需要安全防護(hù)，可使用 Donut 安全網(wǎng)關(guān) ，防爬防刷防攻擊，實現(xiàn)業(yè)務(wù)安全。點擊了解更多 域名配置要求

二、安裝小程序開發(fā)環(huán)境并創(chuàng)建項目

1. 安裝Node.js開發(fā)環(huán)境，請到Node.js頁面下載并安裝Node.js環(huán)境。
安裝過程可參考：IDEA中Node.js環(huán)境下npm報錯Error:0308010C:digital envelope routines:unsupported
安裝配置nvm-windows對Node.js與npm進(jìn)行版本控制

2. 下載并安裝微信小程序開發(fā)工具。詳細(xì)信息請參見開發(fā)工具下載。

3. 打開微信開發(fā)者工具，然后使用微信掃碼登錄。
4. 單擊加號創(chuàng)建微信小程序示例項目。

5. 填寫項目信息，最后單擊新建。
項目名稱：例如lifeAssistant。
目錄：例如D:\project\WeChatProjects\lifeAssistant。
AppID：小程序的唯一標(biāo)識，從小程序控制臺獲取，參考步驟b。
開發(fā)模式：小程序。
后端服務(wù)：不使用云服務(wù)。

三、小程序的項目結(jié)構(gòu)

lifeAssistant
├── app.js
├── app.json
├── app.wxss
├── pages
│   ├── index
│   │   ├── index.js
│   │   ├── index.json
│   │   ├── index.wxml
│   │   └── index.wxss
│   └── logs
│       ├── logs.js
│       ├── logs.json
│       ├── logs.wxml
│       └── logs.wxss
├── project.config.json
├── sitemap.json
└── utils
    └── util.js

可以看到小程序的項目結(jié)構(gòu)中有三種前綴為app的文件，它們定義了小程序的一些全局配置。
app.json 是小程序的全局配置，用于配置小程序的頁面列表、默認(rèn)窗口標(biāo)題、導(dǎo)航欄背景色等。更多請參見全局配置。
app.wxss 定義了全局樣式，作用于當(dāng)前小程序的所有頁面。
app.js 用于注冊小程序應(yīng)用，可配置小程序的生命周期，聲明全局?jǐn)?shù)據(jù)，調(diào)用豐富的 API。

小程序所有的頁面文件都在pages/路徑下，頁面文件有四種文件類型，分別是.js、.wxml、.wcss、和.json后綴的文件。
相比全局配置文件(三種前綴為app的文件)，頁面配置文件只對當(dāng)前頁面生效。
其中.wxml文件定義了當(dāng)前頁面的頁面結(jié)構(gòu)。
小程序中的所有頁面都需要在app.json文件中聲明。更多請參見代碼構(gòu)成。
//app.json文件如下

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "Weixin",
    "navigationBarTextStyle":"black"
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

此外，項目頂層還有開發(fā)工具配置文件project.config.json和爬蟲索引文件sitemap.json。

其他：
說明： 微信小程序提供了豐富的前端API和服務(wù)端API，您可以基于這些API來實現(xiàn)您的小程序功能，更多請參見小程序 API 使用說明。

現(xiàn)在微信小程序的環(huán)境搭建成功了，可以開始根據(jù)需求，開始編寫前后端代碼。

三、本地調(diào)試

1. 本地運行后端服務(wù)。。
2. 關(guān)閉小程序開發(fā)者工具的HTTPS安全性校驗。
a. 單擊工具欄中的設(shè)置 > 項目設(shè)置 > 本地設(shè)置。
b. 在本地設(shè)置中勾選不校驗合法域名、web-view（業(yè)務(wù)域名）、TLS版本以及HTTPS證書。
3. 接下來可以調(diào)用本地后端服務(wù)進(jìn)行小程序的調(diào)試。

文章來源地址http://www.zghlxwxcb.cn/news/detail-725621.html

到了這里，關(guān)于搭建微信小程序環(huán)境及項目結(jié)構(gòu)介紹的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！