一直以來，小程序開發(fā)者必須安裝第三方插件，才能在 JetBrains IDE 中進行小程序開發(fā)。在 JetBrains Marketplace 上，有關插件已有約 50 萬下載量。

　　對于這個在中國快速發(fā)展的特色開發(fā)需求，最近 JetBrains 官方開發(fā)并上線了一款專用于微信小程序開發(fā)的插件（插件名稱：WeChat Mini Program）。讓開發(fā)者無需離開熟悉的開發(fā)環(huán)境，就能輕松上手微信小程序的開發(fā)工作。在保持開發(fā)習慣一致性的同時，大幅提高開發(fā)效率。

　　今天的文章，我們就以小程序開發(fā)者較常使用的 WebStorm 為演示環(huán)境，帶大家了解這款全新官方插件的主要功能，以及您可以如何幫助我們讓這個插件越來越強大。

　　為了保持 WebStorm 本體的輕量，微信小程序的功能以插件的形式提供。安裝好 WebStorm 后，請先在 IDE 的 Marketplace 里下載并安裝插件。開啟 WebStorm 后，點選歡迎頁左方的插件 Tab 后，點選右邊上方的 Marketplace Tab，并在搜索框里搜索 “wechat mini program”（由 JetBrains s.r.o. 開發(fā)的官方插件）。出現結果后，點擊插件名稱右方的 ”安裝” 按鈕，即可完成插件安裝的步驟。

　　另外，為了方便在開發(fā)過程中預覽成果，也請安裝由騰訊官方提供的微信開發(fā)者工具。安裝完成后，為了方便開發(fā)，推薦以分離窗口 + 置頂的方式將模擬器置于桌面左方，并以 WebStorm 開啟相同項目后置于桌面右方，即可無縫以 WebStorm 開發(fā)微信小程序項目并實時預覽頁面成果。

　　九游娛樂官方網址

　　開發(fā)微信小程序可簡單區(qū)分為邏輯層及視圖層兩塊，其中邏輯層主要使用 JavaScript 開發(fā)，而視圖層則由 WXML（WeiXin Markup language：用于描述頁面的結構）與 WXSS（WeiXin Style Sheet：用于描述頁面的樣式）編寫。另外，視圖層還可使用 WXS（WeiXin Script：小程序腳本語言）結合 WXML，動態(tài)構建出頁面的結構。

　　WXML 是專為微信小程序框架設計的一套標簽語言，其結合了組件、事件等功能，可以構建出頁面的結構。現在，通過 WebStorm 的微信小程序插件，IDE 能識別 WXML 語法并提供語法高亮。

　　當輸入符號時，WebStorm 能提示組件名稱及支持的屬性。在輸入class屬性內容時，WebStorm 也能自動提示對應的 WXSS 的樣式名稱。當將鼠標焦點在 WXML 組件名稱上時，WebStorm 會自動彈出快速文檔方便您查閱標記用法及說明。而當輸入符號時，WebStorm 也能自動補全。通過這些功能，除了能減少因打字而發(fā)生的錯誤外，也可以讓您在開發(fā)組件結構時更高效。

　　從邏輯層發(fā)送數據到視圖層顯示，是開發(fā)微信小程序時的常見需求?，F在 WebStorm 能識別Page對象的data數據綁定，當您在 JavaScript 內聲明數據內容后，在 WXML 文件輸入代碼時，IDE 能提示綁定的變量名稱清單并依選擇自動完成。

　　另外，事件是微信小程序框架里，視圖層與邏輯層之間的通訊方式。WebStorm 能識別在 JavaScript 里聲明的事件處理函數，并在編輯 WXML 的屬性時自動補全，讓開發(fā)者在綁定組件及事件處理函數時更方便。

　　九游娛樂官方網址

　　比起近似于 HTML、負責組件結構的 WXML，WXSS 則更像是 CSS，用于描述組件樣式。為了讓廣大的前端開發(fā)者更容易適應 WXSS，其語法具有 CSS 大部分特性，并在 CSS 之上擴展了尺寸單位及樣式導入等特性。WebStorm 的微信小程序插件，針對 WXSS 的這些特殊性，也提供相應的語法支持。

　　在.wxss文件里，使用@import語句可以導入外聯樣式表，WebStorm 除了能提示樣式表的路徑外，搭配轉至聲明快捷鍵（Mac：?+B 或 Win/Linux：Ctrl+B）更可以快速導航到對應的 WXSS 文件。這種跳轉能力也能從.wxss轉至使用到的.wxml文件中，非常方便。

　　在您編輯模板時，WebStorm 的微信小程序插件也支持 WXSS 的style及class語法。除了能提示樣式名稱外，也能自動補全從 JavaScript 綁定數據的變量名稱，減少打字時間并降低發(fā)生錯誤的機會。

　　除了 WXML 及 WXSS 外，WebStorm 也支持 WXS 語法。WXS 是內嵌在 WXML 中的腳本段，可以在 WXML 語法中內嵌腳本，豐富 WXML 中的數據預處理能力，或是編寫簡單的 WXS 事件響應函數。在.wxml文件里，WebStorm 除了可以解析嵌入式的 WXS 腳本，支持 WXML 標記中src屬性的文件引用，還能在模板中自動補全module名稱。

　　通過這篇文章的介紹，相信您已經感受到官方小程序開發(fā)插件能讓您的開發(fā)工作如虎添翼。前陣子我們剛更新了 WebStorm 的授權模式，對于非商業(yè)用途，例如學習、開源項目開發(fā)、教學內容創(chuàng)作或業(yè)余愛好開發(fā)，您現在可以免費使用WebStorm！

　　特別聲明：以上內容(如有圖片或視頻亦包括在內)為自媒體平臺“網易號”用戶上傳并發(fā)布，本平臺僅提供信息存儲服務。

　　“分手費”或超4億，縱橫股份實控人離婚案一審宣判，公司上市至今從未盈利

　　體壇瞎白線歲著名AI專家離世，死因曝光，全程僅1個月，一圖片曝妻子身份

　　《編碼物候》展覽開幕 北京時代美術館以科學藝術解讀數字與生物交織的宇宙節(jié)律

　　寶寶皺著眉頭用一臉嫌棄的眼神，上下掃描打量著大人 網友：這小眼神看來很不滿意啊