Vue環境配置
前言：之前開發過微信小程序，感覺前後端分離的開發非常舒服，在線學習了下Vue這個前端框架，感覺與小程序的開發類似。動手搭建下前後端分離的項目，做個簡單的Demo，體會下前後端分離的開發。寫下這個系列也是記錄自己在學習Vue的實踐過程。Vue官網地址，可在線學習Vue的基本語法，瞭解Vue使用
一、軟件安裝
1.Node.js的安裝
Vue環境運行依賴Node.js,首先安裝Node.js.Node.js的官方網站https://nodejs.org/en/download/，選擇對應的版本下載，本文的環境爲Windows 64位，選擇Windows Installer(.msi) 64安裝，按照提示安裝即可。安裝結束可檢測是否安裝成功
node -v
2.安裝npm
npm（node package manager），通常稱爲Node包管理器，顧名思義，主要功能就是管理node包，包括：安裝、卸載、更新等等。這裏採用淘寶的鏡像，相比國外的鏡像，下載速度能更快一點
npm install -g cnpm --registry=https://registry.npm.taobao.org查看時候安裝成功
3.安裝vue-cli
npm install vue-cli -g安裝結束後，可用vue -V檢測版本信息，查看是否安裝成功
4.安裝webpack
npm install webpack -g二、創建Vue項目
採用的是Vue指令，生成Vue項目，創建的流程如下
在合適的文件夾位置選擇以cmd窗口運行
//創建一個基於webpack新項目
1.vue init webpack first-vue
//Enter進入下一步，按照指示選擇相應的選項
2.cd first-vue//進入生成的項目文件
3.npm run dev //以生產環境啓動項目
4.http://localhost:8080 //瀏覽器登陸驗證
生成的目錄結構
三、界面成功效果
四、安裝問題解決
1.-4048錯誤碼，權限問題
npm ERR! path F:\2018畢業論文\vueproject\my-vue\my-first\node_modules\fsevents\n
ode_modules\getpass\node_modules
npm ERR! code EPERM
npm ERR! errno -4048
npm ERR! syscall scandir
npm ERR! Error: EPERM: operation not permitted, scandir 'F:\2018畢業論文\vueproj
ect\my-vue\my-first\node_modules\fsevents\node_modules\getpass\node_modules'
npm ERR! { Error: EPERM: operation not permitted, scandir 'F:\2018畢業論文\vuep
roject\my-vue\my-first\node_modules\fsevents\node_modules\getpass\node_modules'
npm ERR! stack: 'Error: EPERM: operation not permitted, scandir \'F:\\2018畢業
論文\\vueproject\\my-vue\\my-first\\node_modules\\fsevents\\node_modules\\getpas
s\\node_modules\'',解決辦法：
直接用命令清理緩存就行，
npm cache clean --force2.找不到modules錯誤
Module build failed: Error: Cannot find module 'stylus'
at Function.Module._resolveFilename (module.js:489:15)
at Function.Module._load (module.js:439:25)
at Module.require (module.js:517:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (D:\project\sell\node_modules\[email protected]@sty
lus-loader\index.js:2:14)解決辦法，單獨安裝對應的模塊
npm install stylus@latest五、相關鏈接
Springboot整和Vue，實現前後臺的分離，可參考
前後端分離之Vue（二）前後端整合http://blog.csdn.net/shenbug/article/details/79542717
前後端分離之Vue(三) Vue爬過的那些坑 http://blog.csdn.net/shenbug/article/details/79547171