vue入門通過腳手架搭建專案。
//檢查node版本
node -v
//檢查npm版本
npm -v
//如果版本過低 下面操作進行公升級
npm install -g npm
npm install -g cnpm -registry=
//檢查
cnpm -v
3.安裝vue。
//全域性安裝
cnpm install vue-cli -g
4.安裝webpack
//全域性安裝webpack
cnpm install -webpack -g
5.新建專案
//新建專案之前以免報錯先檢查。
vue -v(大寫) //如果沒有顯示vue版本,npm i vue-cli -g安裝
webpack -v(小寫) //如果需要重新安裝,就用 npm install webpack -g
//以上三個條件都滿足下面新建專案
vue init webpack -my-product
project name 直接預設回車
project description 直接預設
author 寫你自己的名字
use sass 根據需求來定
6.啟動專案
//專案新建完成後找到自己的my-product
cd my-product
//安裝專案依賴
npm install
//啟動專案
npm run dev
//專案打包
npm run build
//目錄結構
/build 構建指令碼目錄
/config 構建配置目錄
/dist 打包後生成的目錄
/node_modules 依賴包
/src 原始碼目錄
/assets 資源目錄( 圖示等)
/components 元件目錄(本專案可提取出共用的元件)
/router 路由目錄(處理跳轉等)
/styles 樣式目錄
/views 頁面目錄
/service 頁面請求目錄
/utils 工具類檔案
home.vue 頁面級元件(共用的一些頭部、底部、左側選單)
main.js 入口檔案
/static 靜態檔案目錄
/test 測試檔案目錄
.eslinetrc.js es靜態檢查目錄
.eslinetignore 配置不需要今天檢查目錄
index.html 入口頁面
packge.json 專案描述檔案
vue cli 搭建vue專案
安裝完成後,開啟命令列工具輸入命令node v,如果出現對應版本號,就說明安裝成功了。npm包管理器,是整合在node中的,所以,直接輸入npm v也會顯示出npm的版本資訊。由於npm的有些資源被牆,為了更快更穩定,所以我們需要切換到 的npm映象 cnpm。npm install g cnpm ...
vue cli搭建vue專案
生成依賴 命令 npm install 4.執行命令 npm run dev 5專案打包命令 npm run build 檢測node版本 node v 檢視npm安裝 npm v 解除安裝vue cli2 npm uninstall vue cli g 安裝vue cli3 npm install...
vue cli 搭建vue專案
前提搭建好nodejs環境 vue cli是vue.js的腳手架,用於自動生成vue.js webpack的專案模板,建立命令如下 vue init webpack 注1 為自己建立專案的名稱 注2 必須先安裝vue,vue cli,webpack,node等一些必要的環境 命令 npm insta...