Vue-cli是vue官方出品的快速構建單頁應用的腳手架
一.首先要確定安裝了node,打開終端輸入node -v,查看node版本,輸入npm -v ,查看npm版本,如果兩個都安裝成功可以進入下一步了。
PS: node安裝非常簡單,自行百度。
二.安裝淘寶鏡像(此步驟可忽略),因為npm速度較慢。
輸入命令
npm install -g cnpm --registry=https://registry.npm.taobao.org
安裝成功后就可以使用cnpm替代npm命令了。
三.安裝全局vuecli
輸入命令 cnpm install vue-cli -g
四.初始化項目
命令格式:vue init <template-name> <project-name>
其中,<template-name>選項為模板名稱,vue-cli官方為我們提供了5種模板。
-
webpack-一個全面的webpack+vue-loader的模板,功能包括熱加載,linting,檢測和CSS擴展。
-
webpack-simple-一個簡單webpack+vue-loader的模板,不包含其他功能,讓你快速的搭建vue的開發環境。
-
browserify-一個全面的Browserify+vueify 的模板,功能包括熱加載,linting,單元檢測。
-
browserify-simple-一個簡單Browserify+vueify的模板,不包含其他功能,讓你快速的搭建vue的開發環境。
- simple-一個最簡單的單頁應用模板。
<project-name>為項目名稱。
我們選擇webpack,輸入命令:
vue init webpack vueliTest
五.按照提示步驟,分別輸入命令:
cd vuecliTest
cnpm install
cnpm run dev
此時服務已開啟,搭建完畢,可以查看文件目錄,