用腳手架搭建vue項目

1.這裏用npm安裝，即node package manager（爲了清楚緣由，我就這樣理解了，node包管理器），先安裝node，node安裝能夠上node官網下載

   https://nodejs.org/en/

安裝好後，打開cmd，輸入npm -v，查看安裝版本，當出現版本號，則說明安裝成功。

查看npm，即npm -v，出現版本號則說明安裝成功。

2.node安裝成功後，安裝腳手架vue cli，輸入npm install vue-cli -g ；g表示global全局安裝，安裝完成後，輸入vue -V查看是否下載成功，出現版本號則說明安裝成功

3.腳手架已經全局安裝好了，那麼下面咱們就能夠利用腳手架搭建一個項目了，首先在你須要搭建項目的目錄中新建一個文件夾，在文件夾下面打開命令窗口，在此文件夾內用vue初始化一個項目。

輸入

     vue init webpack myproject

語法

    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>：標識項目名稱，這個你能夠根據本身的項目來起名字。

 

在搭建項目中會有幾個問題，須要配置一下

Project name :項目名稱 注意：這裏不能使用大寫
Project description:項目描述，默認爲A Vue.js project,直接回車，不用編寫。
Author：做者，若是你有配置git的做者，他會讀取。
Install  vue-router? 是否安裝vue的路由插件，咱們這裏須要安裝，因此選擇Y
Use ESLint to lint your code? 是否用ESLint來限制你的代碼錯誤和風格。
咱們這裏不須要輸入n，若是你是大型團隊開發，最好是進行配置。
setup unit tests with  Karma + Mocha? 是否須要安裝單元測試工具
Karma+Mocha，咱們這裏不須要，因此輸入n。
Setup e2e tests with Nightwatch?是否安裝e2e來進行用戶行爲
模擬測試，咱們這裏不須要，因此輸入n。

這裏就選擇npm安裝 而後等待下載。。。。

實際開發中根據須要配置。

此刻項目已經搭建完成，能夠看到咱們的文件夾下面出現了不少文件了。下面根據他的提示讓咱們進入咱們的項目目錄，

 

而後啓動服務

    npm run dev

能夠看到咱們的項目已經啓動，地址爲localhost:8080;打開地址，能夠看到咱們的項目已經啓動，運行。腳手架搭建vue項目搭建成功。