vue.js框架搭建

安裝腳手架vue

前提條件:已安裝node(4.0版本以上),npmnode

a、全局安裝 vue-cliwebpack

npm install -g vue-cli

安裝成功後能夠經過命令行查看版本號,如圖web

b、初始化項目vue-router

新建一個文件夾命名爲01vue,準備在此文件夾下存放項目,而後執行命令行 vue init 模板類型 項目名稱 ,例:vue-cli

vue init webpack my-vue-project

vue有不少模板類型,例如webpack, simple, browserify,這裏建立的是基於webpack的項目,回車後會有一系列的交互問題:npm

項目的名稱,項目的描述,是否安裝vue-router(用於頁面跳轉),是否採用ESLint(一個代碼檢測的工具,能夠避免低級錯誤和統一代碼風格),是否安裝單元測試等,瀏覽器

能夠一路enter到底,也能夠本身選擇,例:工具

而後能夠發現01vue裏面多了一個名爲my-vue-project文件夾的文件夾單元測試

c、啓動項目

按照上圖提示的命令行來啓動項目

cd my-vue-project
npm install
npm run dev

而後會看到文件夾裏多了一個包含依賴包的文件夾 node_modules,最後在瀏覽器中輸入地址 http://localhost:8080,能夠看到第一個頁面了^v^.

相關文章
相關標籤/搜索