vue學習(1) vue-cli 項目搭建 一、windows環境 1. 下載node.js安裝包 官網：https://nodejs.org/en/download/ 選擇LTS下載 2. 安裝 下載完成後點擊安裝包安裝到自己指定的文件夾 windows + r 打開cmd，在命令行中輸入node ...
vue學習(1) vue-cli 項目搭建
一、windows環境
1. 下載node.js安裝包
官網：https://nodejs.org/en/download/
選擇LTS下載
2. 安裝
下載完成後點擊安裝包安裝到自己指定的文件夾
windows + r 打開cmd，在命令行中輸入node -v，如果安裝成功就可以看到當前node的版本
輸入npm -v，可以看到相應的npm的版本
3. 安裝vue-cli
npm install -g cli
4. 創建cli項目
首先cd進入到你想要創建項目的文件夾目錄下
vue init webpack my-vue
根據提示信息完成創建，項目名、項目描述、作者名、build、路由、ESLint、測試等，ESLint後面幾個推薦選擇no
5. 運行
創建完成後執行
cd my-vue
npm run dev 即可看到提示
Your application is running here: http://localhost:8080，打開該鏈接即可看到你的項目
二、mac環境
1. 下載node.js安裝包
官網：https://nodejs.org/en/download/
選擇LTS下載
2. 安裝
下載完成後點擊安裝包安裝到自己指定的文件夾
打開終端，在命令行中輸入node -v，如果安裝成功就可以看到當前node的版本
輸入npm -v，可以看到相應的npm的版本 （若安裝失敗可以重新下載安裝包進行安裝）
3. 安裝webpack
npm install webpack -g
會提示安裝webpack-cli，根據提示安裝即可
若因為許可權原因安裝失敗，在安裝命令行之前加入sudo,根據提示輸入密碼即可
4. 安裝vue-cli
npm install cli -g
5. 創建cli項目
首先cd進入到你想要創建項目的文件夾目錄下
vue init webpack my-vue
根據提示信息完成創建，項目名、項目描述、作者名、build、路由、ESLint、測試等，ESLint後面幾個推薦選擇no
6. 運行
創建完成後執行
cd my-vue
npm run dev
即可看到提示 Your application is running here: http://localhost:8080
打開該鏈接即可看到你的項目
完.
