---------------------------------
環境說明:win 10
-----------------------------------
1.去官網下載node.js,然後點擊安裝即可。
2.替換源,如果不替換,使用npm安裝軟件會非常的慢
替換方法:使用管理員權限打開cmd窗口,然後輸入npm config set registry http://registry.npm.taobao.org 即可。
3.安裝腳手架,vue-cli,主要用來創建vue項目
在cmd窗口(最好是以管理員權限打開的),輸入命令 npm install vue-cli -g 等待安裝完成即可。
4.創建一個項目
還是在cmd窗口,在你想要創建項目的路徑上輸入命令 vue init webpack pro_name ,其中pro_name爲項目名。期間會提示輸入一些信息,只要按回車即可,等待創建完成。創建完成後,會在選擇的路徑上生成一個新的文件夾(名字爲pro_name)
5.使用VS code打開pro_name項目
6.打開VS code的Terminal.
然後在Terminal內輸入
6.1 npm install //等待安裝結束
6.2 npm run dev //運行項目,成功運行則顯示下圖
6.3 打開鏈接,使用ctrl+鼠標點擊即可打開,正常會顯示下圖
6.4 如果需要將前端項目部署到服務器運行,則需要先在Terminal中執行命令 npm run build ,然後將項目內的dist文件下的內容拷貝到服務器目錄下即可。
6.5 其他一些前端需要安裝包
安裝element-ui
npm install element-ui -S
安裝axios,用於前端和後臺的數據交互
npm install axios
--------------------------------------
PS:最近想做一個物聯網前端(vue)+後臺(python)+硬件設備的一個項目。所以入坑了Vue。關於Vue這部分的內容,我不會涉及太多內容,能夠完成基本的顯示要求即可。在這裏做一下簡單記錄。