vue開發環境搭建(含WebStorm中vue的代碼提醒和微信小程序開發代碼提醒)

第一部分

安裝nodejs

nodejs官網

安裝vue淘寶鏡像

npm install -g vue –registry=https://registry.npm.taobao.org

安裝webpack

npm install webpack -g(-g代表全局安裝,安裝好nodejs後,直接在命令行下面進行就好)

安裝vue腳手架

npm install vue-cli -g(代表全局安裝,安裝好nodejs後,直接在命令行下面進行就好)

第二部分

安裝好環境之後,我們搭建一個項目模板測試
根據模板創建項目
vue init webpack 注意(項目名字不能用中文)

會有一些初始化的設置,如下輸入: (最新版)

啓動項目
npm run dev
(等待幾分鐘,命令行最後出現 Your application is running here: http://localhost:8081,表示模板創建成功)

發佈項目
npm run build

第三部分

之後配置webstorm的環境,僅僅webstorm同步修改,

先將file type(文件類型)找見,在右邊的文件類型中找見HTML類型,最後下面添加(+),輸入*.vue,

這樣webstorm的代碼提示就可以了。

同時微信開發的小程序文件的添加代碼提醒同理:

FileType下Cascading Style Sheet 添加*.wxss

將FileType下HTML 添加*.wxml,

當然還得有js的提醒,下載文件地址:https://github.com/nyhxiaoning/wecharCodejar,導入即可

(友情提示:如果操作正確,插件總是不成功,請考慮是否是webstorm的中文版,筆者中文版多次測試無效,換裝英文版立即成功)

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章