vue實戰,一步步實現vue購物車功能的過程記錄,課程與素材來自慕課網,本身搭建了express本地服務器來請求數據css
做者:狐狸家的魚html
本文連接:vue實戰-實現購物車功能(一)vue
GitHub:sueRimnnode
一、vue基礎git
二、購物車實現github
爲了解決Chrome服務器跨域問題,使用node.js+express搭建本地服務器來請求本地數據。shell
一、安裝node.jsexpress
二、安裝express框架npm
打開window命令提示符窗口,輸入如下命令:windows
npm install express -g
npm install express-generator -g
三、初始化項目
我選擇的是 E:\learning\vue\demo這個文件夾位置初始化個人項目,在這個項目位置按住shift鍵右鍵打開windows powershell窗口,輸入如下命令:
express vueCart
結果以下:
輸入命令進入項目文件:
cd vueCart
而後安裝項目依賴:
npm install
在vs code中打開,項目結構是這樣的:
以上是基於express的MVC框架模式。
四、運行
能夠按住CTRL+shift+Y在vs code打開終端,輸入如下命令啓動服務:
node www
而後在瀏覽器中輸入http://localhost:3000/,這是本地服務器的地址,訪問後頁面是這樣的:
這表明一個基於express的本地服務器搭建成功了(~ ̄▽ ̄)~