因?yàn)槭腔趎odejs的? ?所以要先安裝node翘单。*為必須安裝? 沒(méi)有型號(hào)則不是必須安裝的定铜。(個(gè)人喜好)
一矮锈、node -v
*1. 查看是否安裝node, 如果有版本號(hào)說(shuō)明已安裝钠惩、其他 例如?xx 不是內(nèi)部命令? ?則表示沒(méi)有安裝柒凉,安裝地址(http://nodejs.cn/download/)
2.? 安裝node-sass ?,打開(kāi)控制臺(tái)輸入命令 ???npm install node-sass -g ?等待一會(huì)篓跛,就會(huì)安裝成功膝捞! 安裝出現(xiàn)問(wèn)題可參考? (http://www.reibang.com/p/92afe92db99f)
3. 修改一下npm服務(wù)器的地址,先安裝nrm愧沟,
輸入命令npm install nrm -g蔬咬,然后輸入 nrm ls,查看當(dāng)前npm的服務(wù)器地址沐寺,可以使用
nrm use cnpm這個(gè)命令把地址改為中國(guó)境內(nèi)的服務(wù)器扒袖!
*4.安裝淘寶鏡像
npm install -g?cnpm --registry=https://registry.npm.taobao.org
查看版本號(hào)cnpm -v(最好不要跳過(guò)仇箱,不然可能會(huì)有未知錯(cuò)誤)
二、vue
*1.安裝cli框架
cnpm i vue-cli -g
*2.生成項(xiàng)目
vue init webpack mypro
*3.進(jìn)入項(xiàng)目
cd mypro
*4.安裝項(xiàng)目依賴
cnpm i
5.(基于項(xiàng)目的sass,在項(xiàng)目中安裝一次即可)
cnpm i node-sass sass-loader -D
6.安裝mint-ui庫(kù)(其他的庫(kù) 如:vant 一樣的命令 cnpm i vant ?-S)
cnpm i mint-ui -S
7.cnpm i babel-plugin-component -D
修改.babelrc文件 ?--- 直接將以下內(nèi)容復(fù)制到你的babelrc中
{
????????"presets": [
??????????["env", {
????????????"modules": false,
????????????"targets": {
??????????????"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
????????????}
??????????}],
??????????"stage-2"
????????],
????????"plugins": ["transform-vue-jsx", "transform-runtime", ["component", [
??????????{
????????????"libraryName": "mint-ui",
????????????"style": true
??????????}
????????]]],
????????"env": {
??????????"test": {
????????????"presets": ["env", "stage-2"],
????????????"plugins": ["transform-vue-jsx", "istanbul"]
??????????}
????????}
??????}
8.安裝axios進(jìn)行數(shù)據(jù)請(qǐng)求
cnpm i axios
*9.啟動(dòng)項(xiàng)目
cnpm run dev
如果端口被占用眠砾,則需要更換一個(gè)(config/index.js)
從0~65535全部是標(biāo)準(zhǔn)端口惰许,但是從0~1024號(hào)端口是系統(tǒng)端口帖族,用戶無(wú)法修改
從1025~65534端口是系統(tǒng)為用戶預(yù)留的端口庸毫,而65535號(hào)端口為系統(tǒng)保留
如果在你的vsCode中在終端中打開(kāi)時(shí)冠跷,不能識(shí)別npm,cnpm命令,而在系統(tǒng)的終端中可以識(shí)別厨诸,那么需要卸載vsCode懈涛,重新安裝。
三泳猬、項(xiàng)目文件介紹
build 和 config ?是關(guān)于webpack的配置批钠,里面包括一些server,和端口;
node_modules: 安裝依賴代碼庫(kù)得封;
src : ?存放源碼埋心;
static:存放第三方靜態(tài)資源的,static里面的.gitkeep忙上,如果為空拷呆,也可以提交到gitHub上面,正常情況下疫粥,是不可以提交的茬斧。
?.babelrc:把es6文件編譯成es5
.editorconfig:編輯器的配置
.eslintignore 忽略語(yǔ)法檢查的目錄文件
就是忽略對(duì)build/*.js和 config/*.js
入口文件: index.html ? ?和 main.js
vue取消嚴(yán)格模式
在.eslintignore中增加src/*