一睦焕、那么我們就從最簡單的環(huán)境搭建開始：
安裝node.js狠毯，從node.js官網(wǎng)下載并安裝node护糖，安裝過程很簡單，一路“下一步”就可以了嚼松。安裝完成之后嫡良，打開命令行工具(win+r，然后輸入cmd)献酗，輸入 node -v寝受，如下圖，如果出現(xiàn)相應的版本號罕偎，則說明安裝成功很澄。
這里需要說明下，因為在官網(wǎng)下載安裝node.js后颜及，就已經(jīng)自帶npm（包管理工具）了甩苛，另需要注意的是npm的版本最好是3.x.x以上，以免對后續(xù)產(chǎn)生影響俏站。
安裝淘寶鏡像讯蒲，打開命令行工具，把這個（npm install -g cnpm --registry= https://registry.npm.taobao.org）肄扎，安裝這里是因為我們用的npm的服務器是外國墨林，有的時候我們安裝“依賴”的時候很很慢很慢超級慢，所以就用這個cnpm來安裝我們說需要的“依賴”犯祠。安裝完成之后輸入 cnpm -v旭等，如下圖，如果出現(xiàn)相應的版本號衡载，則說明安裝成功辆雾。
安裝webpack，打開命令行工具輸入：npm install webpack -g月劈，安裝完成之后輸入 webpack -v，如下圖藤乙，如果出現(xiàn)相應的版本號猜揪，則說明安裝成功。
安裝vue-cli腳手架構(gòu)建工具坛梁，打開命令行工具輸入：npm install vue-cli -g而姐，安裝完成之后輸入 vue -V（注意這里是大寫的“V”），如下圖划咐，如果出現(xiàn)相應的版本號拴念，則說明安裝成功钧萍。
二、通過以上四步政鼠，我們需要準備的環(huán)境和工具都準備好了风瘦，接下來就開始使用vue-cli來構(gòu)建項目
- 在硬盤上找一個文件夾放工程用的。這里有兩種方式指定到相關目錄：①cd 目錄路徑 ②如果以安裝git的公般，在相關目錄右鍵選擇Git Bash Here万搔。
- 安裝vue腳手架輸入：vue init webpack exprice ，注意這里的“exprice” 是項目的名稱可以說是隨便的起名官帘，但是需要主要的是“不能用中文”瞬雹。
$ vue init webpack exprice --------------------- 這個是那個安裝vue腳手架的命令
This will install Vue 2.x version of the template. ---------------------這里說明將要創(chuàng)建一個vue 2.x版本的項目
For Vue 1.x use: vue init webpack#1.0 exprice
? Project name (exprice) ---------------------項目名稱
? Project name exprice
? Project description (A Vue.js project) ---------------------項目描述
? Project description A Vue.js project
? Author Datura --------------------- 項目創(chuàng)建者
? Author Datura
? Vue build (Use arrow keys)
? Vue build standalone
? Install vue-router? (Y/n) --------------------- 是否安裝Vue路由，也就是以后是spa（但頁面應用需要的模塊）
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n ---------------------是否啟用eslint檢測規(guī)則刽虹，這里個人建議選no
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? (Y/n)
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? (Y/n)
? Setup e2e tests with Nightwatch? Yes
vue-cli · Generated "exprice".
To get started: --------------------- 這里說明如何啟動這個服務
cd exprice
npm install
npm run dev
如下圖：
- cd 命令進入創(chuàng)建的工程目錄酗捌，首先cd exprice（這里是自己建工程的名字）；
- 安裝項目依賴：npm install涌哲，因為自動構(gòu)建過程中已存在package.json文件胖缤，所以這里直接安裝依賴就行。不要從國內(nèi)鏡像cnpm安裝(會導致后面缺了很多依賴庫)膛虫，但是但是如果真的安裝“個把”小時也沒成功那就用：cnpm install 吧草姻。
- 安裝 vue 路由模塊 vue-router 和網(wǎng)絡請求模塊 vue-resource，輸入：cnpm install vue-router vue-resource --save稍刀。
下面我簡單的說明下各個目錄都是干嘛的：
需要import scss文件的下載以下：
首先安裝node-sass和sass-loader
cnpm install node-sass && sass-loader --save
cnpm install axios --save
然后在build文件夾下的webpack.base.conf.js的rules里面添加配置
{
test: /\.sass$/,
loaders: ['style','css', 'sass']
}
在APP.vue中修改style標簽
<style lang="scss">
