vue專案實戰（一）之vue cli腳手架搭建專案

npm install -g cnpm --registry=

alias cnpm="npm --registry= \

--cache=$home/.npm/.cache/cnpm \
--disturl= \
--userconfig=$home/.cnpmrc"

cnpm install --global vue-cli

vue init webpack yv-pai

project name 專案名開始我們可以直接回車，下面進行選擇：

安裝完成之後，通過cd命令進入到專案目錄

cd yv-pai/

然後執行專案

npm run dev

http://localhost:8081

我這裡使用的是sublime軟體進行vue專案的開發，大家也可以選擇自己喜歡的ide進行開發。

開啟專案後目錄結構介紹如下：

1.首先是index.html入口頁面

4.開啟router/index.js路由js檔案，首先引入相關依賴和元件

import vue from 'vue' //引入vue

import router from 'vue-router' //引入路由vue-router
import helloworld from '@/components/helloworld' //引入helloworld元件

在規則routes裡面定義了訪問"/"路徑時會跳轉到helloworld元件，因此會將helloworld元件的內容顯示在內

5.開啟components/helloworld.vue元件，會發現這裡就是我們訪問的網頁顯示的內容

關於vue的其他功能以後章節將會逐一介紹。

訪問我的達人課

訪問我的部落格 wang's blog

vue cli 搭建vue專案

安裝完成後，開啟命令列工具輸入命令node v，如果出現對應版本號，就說明安裝成功了。npm包管理器，是整合在node中的，所以，直接輸入npm v也會顯示出npm的版本資訊。由於npm的有些資源被牆，為了更快更穩定,所以我們需要切換到 的npm映象 cnpm。npm install g cnpm ...

初識vue專案 vue cli

安裝vue cli 1.先安裝node,安裝node的時候會自動安裝npm,可以通過 node v 和 npm v 測試版本 2.全域性安裝node 這個去看官方文件就可以 3.執行 npm run dev 注意事項 window系統不建議用gitbash 因為我就是用的 總是出問題，建議用powe...

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...