1、下載並安裝node.js
官網地址: https://nodejs.org/en/ , 當前版本是 node-v8.11.4-x64.msi, 安裝過程直接默認選項即可。
我下載的解壓版本
解壓在E盤目錄如下:E:\vue
環境變量配置:路徑為剛才解壓的路徑
變量名:path
變量值:;E:\vue\node-v12.18.3-win-x86
安裝完成后, 在CMD控制台輸入 node -v 和 npm -v ,如果都能顯示版本號,則是安裝成功
1.1使用下面命令更改npm的源地址為淘寶源
npm config set registry http://registry.npm.taobao.org/
更改之后,查看是否正確的被更改
npm config get registry
1.3安裝vue-cli
使用下面命令安裝vue-cli工具
npm install -g @vue/cli
安裝好之后,檢查vue-cli是否安裝成功
vue --version
2、安裝eclipse codemix插件
打開Eclipse, 選擇 Help -->Eclipse MarketPlace,輸入 vue 搜索codeminx插件, 點擊 install 進行安裝,如下圖, 安裝完成后,會提示重啟eclipse,點擊重啟即可。
重啟eclipse后會進入到codeminx歡迎頁, 直接點擊 next, 到最后close就行
3、新建VueProject
選擇 File -->New -->Other-->CodeMix-->VueProject,然后點擊next 輸入項目名, 最后點擊finish創建項目, 如下圖
4、在eclipse中的Vue項目中打開系統終端
先打開項目根目錄的任何文件, 比如READFIRST.md 或 README.md, 然后默認使用快捷鍵 Ctrl + Alt + T 即可打開終端,如下圖, 終端目錄地址是項目根目錄。
如果上述快捷鍵打不開, 則輸入 Ctrl + Shift + P 打開搜索框, 輸入 terminal關鍵字查找到 "Open Local Terminal on Selection" 選項,按回車即可打開終端
5、測試終端命令
在終端中輸入 npm -v 后回車,如果顯示版本信息則正常, 如果提示找不到命令, 則重新關閉eclipse並啟動即可,如下圖:
6、安裝npm依賴模塊
在終端中輸入 npm install 后回車,安裝完成會生成 node_modules目錄,該目錄是npm加載的項目依賴模塊
7、運行Vue項目
在終端中輸入 npm run dev 后回車,則運行Vue項目,之后會自動打開瀏覽器,顯示Vue歡迎頁面!
至此,codemix插件算是完成安裝並測試通過, 后續Vue開發, 靠大家自己摸索啦!