vue.js框架搭建
阿新 • • 發佈:2017-10-31
img bsp lin 依賴 logs 查看版本 local router run
安裝腳手架
前提條件:已安裝node(4.0版本以上),npm
a、全局安裝 vue-cli
npm install -g vue-cli
安裝成功後可以通過命令行查看版本號,如圖
b、初始化項目
新建一個文件夾命名為01vue,準備在此文件夾下存放項目,然後執行命令行 vue init 模板類型 項目名稱 ,例:
vue init webpack my-vue-project
vue有很多模板類型,例如webpack, simple, browserify,這裏創建的是基於webpack的項目,回車後會有一系列的交互問題:
項目的名稱,項目的描述,是否安裝vue-router(用於頁面跳轉),是否采用ESLint(一個代碼檢測的工具,可以避免低級錯誤和統一代碼風格),是否安裝單元測試等,
可以一路enter到底,也可以自己選擇,例:
然後可以發現01vue裏面多了一個名為my-vue-project文件夾的文件夾
c、啟動項目
按照上圖提示的命令行來啟動項目
cd my-vue-project
npm install
npm run dev
然後會看到文件夾裏多了一個包含依賴包的文件夾 node_modules,最後在瀏覽器中輸入地址 http://localhost:8080,可以看到第一個頁面了^v^.
vue.js框架搭建