github
vue學(xué)習(xí)筆記（2）主要介紹項(xiàng)目的基本設(shè)置，如axios設(shè)置和項(xiàng)目顏色控制
vue學(xué)習(xí)筆記（3）主要介紹vue的router簡單用法
vue是一個前端框架陈肛，通過將html中的各種dom渲染成vue自己的虛擬dom酪术，然后通過虛擬dom進(jìn)行數(shù)據(jù)雙向綁定完成數(shù)據(jù)的渲染。這樣在編寫頁面的時候大大提高了編寫效率，并且學(xué)習(xí)曲線比較平緩恤磷，對h5有基礎(chǔ)的認(rèn)識就可以進(jìn)行相應(yīng)的開發(fā)了。
vue的項(xiàng)目創(chuàng)建可以基于腳手架進(jìn)行相關(guān)的設(shè)置野宜，集成webpack很方便的進(jìn)行vue項(xiàng)目的打包碗殷，這樣打包后的文件可以直接進(jìn)行nginx或者web服務(wù)器工具，很方便的進(jìn)行配置速缨。
vue優(yōu)點(diǎn)
1锌妻、數(shù)據(jù)雙向綁定
2、學(xué)習(xí)成本低旬牲，學(xué)習(xí)曲線平緩
3仿粹、前后端分離
vue項(xiàng)目創(chuàng)建
一、安裝npm原茅，vue吭历，vue-cli
在vue構(gòu)建的時候一般使用npm安裝，也可以使用cnpm擂橘，
去nodejs官網(wǎng)去下載對應(yīng)的安裝包即可安裝node晌区，而npm是繼承在nodejs的包管理工具。同時就安裝了npm，這一步大家就自己探索吧朗若。
然后下一步就要裝恼五，vue和vue-cli了
npm install vue
npm install @vue/cli
#全局安裝
npm install -g vue
npm install -g @vue/cli
#腳手架2.x版本
npm install -g vue-cli
腳手架有兩個版本，一個是2.x版本哭懈，一個是3.0版本灾馒，我建議使用3.0版本，其有更強(qiáng)大的圖形管理界面和更簡單的配置遣总，可以通過使用新增文件的方式進(jìn)行配置睬罗。
二、使用vue-cli創(chuàng)建項(xiàng)目
在需要創(chuàng)建項(xiàng)目的文件夾里
vue create hello-world #項(xiàng)目名稱
然后會出現(xiàn)配置命令行旭斥，這個時候可以根據(jù)提示進(jìn)行項(xiàng)目的配置容达，新學(xué)者可以使用default進(jìn)行默認(rèn)創(chuàng)建項(xiàng)目，然后通過創(chuàng)建好的項(xiàng)目結(jié)構(gòu)垂券，了解一下每一個目錄文件的具體用處花盐。然后再通過自定義配置創(chuàng)建不同的項(xiàng)目，來查看每一個配置對于初始項(xiàng)目添加的是哪些內(nèi)容圆米，來進(jìn)行整體項(xiàng)目的了解卒暂。
自定義配置是配置項(xiàng)目中需要使用到的插件進(jìn)行配置，主要是babel娄帖，使用的js還是ts也祠，是否使用pwa（一般h5項(xiàng)目不需要），router近速，vuex诈嘿，css預(yù)加載器，代碼檢查削葱，單元測試奖亚，e2e測試這幾項(xiàng)內(nèi)容進(jìn)行配置。一般的話可以勾選babel析砸，router昔字，vuex（看項(xiàng)目中是否會用到狀態(tài)管理），代碼檢查等首繁，按需勾選作郭。
配置好了后就可以進(jìn)入項(xiàng)目中進(jìn)行項(xiàng)目結(jié)構(gòu)的了解了。
項(xiàng)目結(jié)構(gòu)非常簡單弦疮，主要有三個文件夾：
- node_modules
存放項(xiàng)目中所需要的基礎(chǔ)插件 - public
存放的是入口文件index.html和靜態(tài)文件 - src
主要工作目錄夹攒，用于存放項(xiàng)目中使用到的圖片資源以及相關(guān)的組件，和頁面胁塞，router咏尝，狀態(tài)管理等文件
還有幾個比較重要的文件 - babel.config.js
配置babel压语，選擇js的編譯方式 - package.json
用于項(xiàng)目配置，主要設(shè)置項(xiàng)目名稱编检，版本號胎食，一些腳本如打包，sever蒙谓，測試腳本斥季。還有項(xiàng)目依賴和dev環(huán)境依賴训桶，eslint校驗(yàn)方式等設(shè)置累驮。 - vue.config.js （默認(rèn)沒有自己按需創(chuàng)建）
腳手架的相關(guān)配置，具體可以查看vue-cli配置
基本上vue項(xiàng)目創(chuàng)建就先介紹到這里了舵揭，如果對于vue語法有不了解的可以去vue官網(wǎng)了解一下
加油吧谤专，快去創(chuàng)建自己的vue項(xiàng)目吧！
