1、查看node版本node -v

image.png
2、全局安裝node-cli,npm install -g vue-cli
3、運行vue指令可以查看操作

image.png
4、運行vue list 指令可以查看可用模板

image.png
5、以webpack模板為例

image.png
6、按提示執(zhí)行操作

image.png
7、運行從GitHub上下載下來的項目
npm install
npn run dev
參考文章
Eslint 規(guī)則說明
7、配置less
在命令行中輸入 npm install less less-loader --save

安裝less
8、配置sass
npm install node-sass --save-dev
npm install sass-loader --save-dev
這里用的是淘寶鏡像故改為cnpm

image.png
9、安裝與配置axios
npm install axios --save

image.png
axios使用,更多示例參見官網(wǎng)https://www.npmjs.com/package/axios
this.$axios({
method: 'post',
url: '/api/j_spring_security_check',
data: {
account: this.username,
password: this.password
}
}).then((response)=>{
//最好用箭頭函數(shù),不然this的指發(fā)生改變
console.log(response);
}).catch((err)=>{
console.log(err);
});
10、vue+webpack跨域配置

image.png