HBuilderX 是一款基于開源項目 vscode 的前端開發工具，它支持絕大部分的 Web 開發領域。通過 HBuilderX 我們可以很方便地開發、調試和發布 Vue 應用程序。本文將介紹如何在 HBuilderX 中配置 Vue 開發環境，并展示如何運行一個 Vue 應用程序。

首先，在 HBuilderX 中新建一個 Vue 項目。點擊菜單欄中的「項目」，然后選擇「Vue.js」 -「Vue.js Project」。接著，輸入項目名稱和目錄，HBuilderX 會自動幫我們下載 Vue.js，并創建好一個基礎的 Vue 項目。

# 安裝 vue-cli
npm install -g @vue/cli
# 創建項目
vue create my-project

Vue 項目創建完成后，我們需要運行它。在 HBuilderX 中的「資源管理器」中找到剛創建的 Vue 項目，右鍵選擇「啟動」或「調試啟動」，然后我們就可以在瀏覽器中看到我們的 Vue 應用程序了。

如果你需要在編輯器中進行 Vue 開發 需要安裝Vue開發插件：在 HBuilderX 中打開「插件中心」，搜索「Vue」，安裝「Vue」和「Vue 語法高亮」兩個插件。

總的來說， HBuilderX 是一款功能強大且方便使用的前端開發工具，它為我們提供了豐富的 Vue 開發環境，幫助我們更加輕松地開發和調試 Vue 應用程序。