HbuilderX:uni app踩坑之uView-ui

最近在自學uniapp，想找一個ui架構提高一下學習和開發的效率，于是就網上沖浪，浪來浪去，最後選擇了uView-ui這款。其實有些架構我是有基礎的，比如bootstrap、element、iView…可能比較喜歡新鮮的東西吧，就一腳踩進了uView。看官方文檔感覺挺好用的，然後說幹就幹，從環境開始。

HbuilderX對uniapp的內建挺好的，有現成的模闆可以用：

其中也有uView模闆，拿來就用，很友善

但我可能是比較喜歡鑽（搞）研（笑）吧，就是想自己配置一下uView，然後就是一系列的崩潰…

我按照官方文檔（添加連結描述）的步驟來配置環境，很easy，這裡就不貼截圖了，官網都有。有了vue基礎，簡直就是分分鐘的事。下面說說遇到的坑吧。

坑一：

我嘗試了官方文檔的環境配置不知道多少遍，配了又删删了又配，運作之後就是一直報錯，一直說缺少什麼什麼檔案，自己又看不懂，百度也找不到解決方案，是以又百度了使用vue-cli腳手架方式建立uniapp項目，再npm安裝uView，還是不太行的樣子…然後又仔細看了不知道多少遍官方文檔的環境安裝配置步驟，其實官方文檔說的很明白：

我電腦上的版本一直是标準版…無語…蠢哭…官方文檔很友好，小夥伴們閱讀要仔細了。

将HbuilderX換成開發闆後，又配置了一下uView環境，一次成功。呼~

坑二：

這個不算是很大的坑。uView與element差不多，标簽的寫法以u開頭，但是我将環境配置好之後，在敲代碼時，與uView有關的标簽沒有代碼提示，敲着很不舒服，于是又百度啊百度啊百度…這類問題百度幾乎沒有答案，也可能是我搜尋關鍵字不太對。唯一有點希望的解決的方案是：将.vue檔案移到項目的根目錄下，我知道這樣不太合理，但還是試了試能不能解決代碼提示問題，果然…騙人的，不行！（也不排除有些小夥伴用這種方式可行）然後我就想啊想啊想啊…怎麼辦怎麼辦呢，于是就想，官方給了兩種uView配置的方式，我用的是npm安裝方式，另一種是下載下傳安裝，于是我就…沒錯，我将uView下載下傳了下來，然後将其複制到項目的根目錄下，代碼提示問題完美解決。是以小夥伴們可以試試直接下載下傳安裝配置uView環境，不用npm安裝（這個方式我沒試過，感覺應該沒問題），這樣環境與代碼提示就一步到位了。

下面介紹兩種下載下傳uView的方式：

方式1：

https://ext.dcloud.net.cn/plugin?id=1593

這是官方給的位址，最好是谷歌浏覽器。進去之後，往下拉，依次選擇：

項目名稱可以預設，也可以自己另外命名。

将目錄下的uview-ui目錄整個複制到自己的項目的根目錄下。

方式2：

在HbuilderX建立項目時，直接選擇uView UI模闆建立項目

然後在這個模闆項目的基礎上編寫自己的代碼。

希望這篇部落格能幫到一些小夥伴。每天都犯蠢，每天都快樂，程式猿/媛寶寶們加油！