小程序開發工具模拟器（微信小程序開發工具模拟器不顯示）

今天給各位分享小程序開發工具模拟器的(de)知識，其中也會對微信小程序開發工具模拟器不顯示進行(xíng)解釋，如(rú)果能碰巧解決你現在面臨的(de)問題，别忘了關注本站，現在開始吧(ba)！

本文目錄一(yī)覽：

• 1、微信小程序怎麽搞的(de)？
• 2、微信小程序模拟器為(wèi)什麽一(yī)直隻有(yǒu)helloworld
• 3、怎樣開發微信的(de)小程序

微信小程序怎麽搞的(de)？

微信小程序申請前的(de)準備：

首先，你需要注冊一(yī)個小程序賬号。需要用一(yī)個沒注冊過公衆号的(de)郵箱注冊。注冊過程中需要很多認證，比較繁瑣。如(rú)果暫時隻是試水、沒有(yǒu)發布的(de)打算，那麽隻要完成基本信息填寫就可(kě)以，不需要完成微信認證。

之後，就可(kě)以在公衆平台使用注冊的(de)帳戶進行(xíng)登錄。

然後，在主頁面左邊列表中點擊設置，再設置頁面中選開發設置，就可(kě)以看到AppID。而AppID 可(kě)以用于在開發工具中進行(xíng)登記，使用開發工具的(de)高(gāo)級功能。你可(kě)以到官網下載開發工具。

開始項目：

打開開發者工具，選擇小程序選項，然後直接點擊「添加項目」按鈕。我(wǒ)們(men)可(kě)以在這個步驟，填入剛才注冊的(de)時候使用的(de) AppID。

如(rú)果項目目錄中的(de)文件是個空文件夾，會提示是否創建 quick start 項目。

選擇「是」，開發者工具會幫助我(wǒ)們(men)在開發目錄裏生成一(yī)個簡單的(de) Demo。

這個 Demo 擁有(yǒu)一(yī)個完整的(de)小程序的(de)大概框架。

1. 框架

我(wǒ)們(men)首先看一(yī)下官方提供的(de) Demo 含有(yǒu)的(de)目錄：

app.js：小程序邏輯、生命周期、全局變量。

app.json：小程序公共設置、導航欄顔色等，不可(kě)以注釋。

app.wxss：小程序公共樣式，類似 CSS 。

小程序頁面構成類似這樣：

每一(yī)個小程序頁面是由同路徑下同名的(de)四個不同後綴文件的(de)組成，如(rú)：index.js、index.wxml、index.wxss、index.json

微信小程序中的(de)每一(yī)個頁面的(de)路徑和(hé)頁面文件名，都需要寫在app.json的(de)pages中，且pages數組中的(de)第一(yī)個頁面是小程序的(de)首頁。

這四個文件按照功能可(kě)以分成三個部分：

配置：json 文件

邏輯層：js 文件

視(shì)圖層：wxss.wxml 文件

在 iOS 上，小程序的(de)邏輯代碼運行(xíng)于 JavaScriptCore 中，而在 Android上，這個任務則是交給 X5 內(nèi)核來完成。

在 開發工具上， 小程序的(de) JavaScript 代碼是運行(xíng)在 NW.js（Chrome 內(nèi)核） 中。這也導緻開發工具上的(de)效果跟實際效果有(yǒu)所出入。

2. 組件

微信提供了許多組件，主要分為(wèi)八種:

這其中，包含了view、scroll-view、button、form等普通常用的(de)組件，也提供了地(dì)圖mapcanvas

組件主要屬于視(shì)圖層，通過 WXML 來進行(xíng)結構布局，類似于 HTML。樣式則通過 WXSS 來定義和(hé)修改，它的(de)語法和(hé)使用都近似 CSS。

組件使用語法實例：

3. API

網絡

媒體

數據

位置

設備

界面

開發接口

網絡請求接口包含了普通的(de) HTTPS 請求，支持上傳、下載、Socket，基本上滿足了我(wǒ)們(men)開發中所需要的(de)網絡需求。

這些 API 屬于邏輯層，寫在 JS 邏輯文件中。

使用實例：

wx.getLocation({ type: 'wgs84', success: function(res) { var latitude = res.latitude var longitude = res.longitude var speed = res.speed var accuracy = res.accuracy } })

可(kě)以到官方文檔 – API 查看其它 API 的(de)使用方法。

編譯運行(xíng)

1. 模拟器調試

我(wǒ)們(men)可(kě)以在微信提供的(de)開發者工具中，使用模拟器查看小程序運行(xíng)的(de)效果。

之前我(wǒ)們(men)提過，小程序的(de)運行(xíng)底層不同，這也導緻在模拟器上的(de)效果，會與在手機(jī)上運行(xíng)有(yǒu)些差異。

2. 真機(jī)調試

在左邊的(de)選項欄中，選擇項目，然後點預覽會生産一(yī)個二維碼，用管理(lǐ)員微信号掃一(yī)掃，就可(kě)以在真機(jī)上看實際效果。

微信小程序模拟器為(wèi)什麽一(yī)直隻有(yǒu)helloworld

可(kě)能是設置問題。

HelloWorld中文意思是你好，世界。因為(wèi)《TheCProgrammingLanguage》中使用它做(zuò)為(wèi)第一(yī)個演示程序，非常著名，所以後來的(de)程序員在學(xué)習編程或進行(xíng)設備調試時延續了這一(yī)習慣。

微信WeChat是騰訊公司于2011年(nián)1月21日推出的(de)一(yī)個為(wèi)智能終端提供即時通訊服務的(de)免費應用程序，由張小龍所帶領的(de)騰訊廣州研發中心産品團隊打造。微信支持跨通信運營商(shāng)、跨操作系統平台通過網絡快速發送免費（需消耗少量網絡流量）語音短(duǎn)信、視(shì)頻、圖片和(hé)文字，同時，也可(kě)以使用通過共享流媒體內(nèi)容的(de)資料和(hé)基于位置的(de)社交插件搖一(yī)搖、朋(péng)友圈、公衆平台、語音記事本等服務插件。

怎樣開發微信的(de)小程序

首先要下載微信官方的(de)微信Web開發者工具。打開微信公衆平台（mp.weixin.qq.com），找到右下方的(de)小程序模塊，點擊「開發」按鈕；

點擊頂部導航欄的(de)「工具」按鈕，在新頁面的(de)左側欄中找到「下載」。可(kě)以看到，開發工具提供 Windows 32 位、Windows 64 位和(hé) Mac 三個版本。可(kě)根據實際情況，選擇适合自(zì)己電腦的(de)開發工具。

安裝後，就可(kě)以直接啓動開發者工具。如(rú)果是首次啓動開發者工具，需要使用開發者的(de)微信号掃碼登錄。登陸後，點擊「添加項目」按鈕，填寫 AppID（如(rú)果沒有(yǒu)，則點擊無 AppID）和(hé)項目名稱。接着，在項目目錄中點擊「選擇」，新建一(yī)個文件夾作為(wèi)新的(de)項目目錄。然後再次點擊「添加項目」，就可(kě)以新建出一(yī)個微信小程序項目了。

微信開發者工具共分成「編輯」、「調試」和(hé)「項目」三個部分。

編輯：編輯和(hé)修改小程序的(de)代碼。

調試：顯示小程序代碼錯誤和(hé)警告，便于調試代碼錯誤。

項目：用于查看小程序的(de)屬性、修改小程序配置，以及提交小程序代碼至微信服務器。

開發工具還提供簡單的(de)模拟器（頁面左側），開發者可(kě)以使用模拟器在電腦上模拟用戶點擊及使用，提供後台情況模拟、多媒體播放器調試、緩存數據處理(lǐ)等功能。

懂技術的(de)程序員到這一(yī)步就可(kě)以自(zì)己開發了。而不懂編程的(de)小白，可(kě)以登錄微信小程序制作平台「即速應用」官方網站進行(xíng)小程序的(de)制作。裏面有(yǒu)大量的(de)小程序模闆，根據自(zì)己的(de)需求選擇一(yī)個模闆進行(xíng)制作即可(kě)。

制作完成後，點擊「生成」按鈕。然後選擇「小程序打包」，下載小程序的(de)标準代碼包。

回到在微信Web開發工具中，在「項目目錄」這一(yī)欄選擇下載好的(de)代碼包，打開後就可(kě)以看到小程序的(de)預覽效果了。

在「項目」頁面中，開發者可(kě)以查看小程序的(de)基本屬性，也可(kě)以進行(xíng)真機(jī)預覽調試，或向微信服務器提交一(yī)個新版本的(de)小程序代碼。服務器收到代碼後，管理(lǐ)員就可(kě)以通過公衆平台，将新版本提交審核了。

9

以上就是微信小程序開發工具的(de)具體使用方法。磨刀不誤砍材工，隻有(yǒu)認真了解過微信小程序開發工具如(rú)何使用，才能才微信小程序推出的(de)關鍵時期抓住機(jī)會，盡快進入市(shì)場，拿下小程序的(de)第一(yī)波紅(hóng)利。

小程序開發工具模拟器的(de)介紹就聊到這裏吧(ba)，感謝你花時間閱讀本站內(nèi)容，更多關于微信小程序開發工具模拟器不顯示、小程序開發工具模拟器的(de)信息别忘了在本站進行(xíng)查找喔。