這里簡單解釋下vue-cli的項(xiàng)目最外層都引入了什么組件 做什么用

{ //這個代碼塊里的都是項(xiàng)目描述嫩挤，是創(chuàng)建者自定義的
  "name": "qqmusic",  //項(xiàng)目名稱
  "version": "1.0.0",   //項(xiàng)目版本
  "description": "qq music app by vue", //項(xiàng)目描述
  "author": "yangbo", //項(xiàng)目作者
  "private": true, //是否為私有
  "scripts": { //這里是命名一些變量對應(yīng)什么指令
    "dev": "node build/dev-server.js", //運(yùn)行dev 相當(dāng)于運(yùn)行node build/dev-server.js
    "start": "node build/dev-server.js", //同上
    "build": "node build/build.js", //同上
    "lint": "eslint --ext .js,.vue src" //同上
  },
  "dependencies": { //這個代碼塊描述此 項(xiàng)目依賴 的插件畅形；下面兩個做什么的自行搜索
    "vue": "^2.2.6", 
    "vue-router": "^2.3.1"
  },
  "devDependencies": { //這個代碼塊里描述的是此項(xiàng)目 運(yùn)行依賴 插件承边；注意根上面項(xiàng)目依賴的區(qū)分
    "autoprefixer": "^6.7.2", //這英文翻譯過來就是：自動 預(yù) 修復(fù)者蠢琳，專業(yè)稱呼知道的可以回復(fù)下伯襟；它是一個css前綴處理工具，有了它我們就不用寫很多前綴了
    "babel-core": "^6.22.1", //babel是es6編譯工具荤傲，將es6 7語法編譯成es5語法呐伞，以兼容不支持es6 7的瀏覽器，這個是babel的核心組件
    "babel-eslint": "^7.1.1", //eslint是一個約束編碼者的代碼風(fēng)格工具瘟檩，這個是babel版本的eslint抹缕，如果那里寫的不符合eslint的要求，就會報錯墨辛，練習(xí)這個建議用熟練的項(xiàng)目來練習(xí)
    "babel-loader": "^6.2.10", //這是babel的加載組件卓研，有了它就可以讓babel和webpack對我們的js文件進(jìn)行處理轉(zhuǎn)換
    "babel-plugin-transform-runtime": "^6.22.0", //babel用來修復(fù)自己轉(zhuǎn)換不足的一個組件 https://segmentfault.com/q/1010000005596587?from=singlemessage&isappinstalled=1
    "babel-preset-env": "^1.3.2", //智能識別當(dāng)前運(yùn)行環(huán)境，不支持es6 7才進(jìn)行轉(zhuǎn)換，在高性能瀏覽器上會保留高性能的es6 7語法
    "babel-preset-stage-2": "^6.22.0", //stage0 1 2 3是babel編譯范圍的一個標(biāo)準(zhǔn)奏赘，2版本適合開發(fā)使用 http://www.cnblogs.com/chris-oil/p/5717544.html
    "babel-register": "^6.22.0", //官方介紹它可以讓babel-core自動鉤到我們需要編譯的地方寥闪，懂得請回復(fù)，方便大家
    "chalk": "^1.1.3", // 代碼的顏色是它幫忙實(shí)現(xiàn)的
    "connect-history-api-fallback": "^1.3.0", //解決單頁面應(yīng)用刷新和直接通過域名+參數(shù)訪問時候出現(xiàn)404的不足 https://github.com/bripkens/connect-history-api-fallback
    "copy-webpack-plugin": "^4.0.1", //webpack的一個文件和目錄復(fù)制工具磨淌，項(xiàng)目部分路徑問題的解決者
    "css-loader": "^0.28.0", //css加載組件橙垢，默認(rèn)css不支持@import ../path/test.css 這種在一個css中引入另一個css的方式，而有了它伦糯，就可以這樣引入了 http://cache.baiducontent.com/c?m=9f65cb4a8c8507ed4fece763105392230e54f73f7e88885468d4e419ce3b46031437bae872750d5592846b6777f1140fbca77666725e60e19499c90bcabae23f2ffe30350042db12448459&p=8c769a47c09f05ff57ee957e610a86&newp=8b2a97118d9159ff57ee957e500793231610db2151d7d5166b82c825d7331b001c3bbfb42324130fd3c0786707ac4b59eff23570310221a3dda5c91d9fb4c57479dc7c6668&user=baidu&fm=sc&query=css-loader&qid=b877345400022555&p1=3
    "eslint": "^3.19.0", //這是官方eslint，用于統(tǒng)一代碼風(fēng)格的工具嗽元，寫的不符合規(guī)范就給報錯敛纲，再次建議，在自己有把握的熟練項(xiàng)目里練習(xí)它比較好
    "eslint-friendly-formatter": "^2.0.7", //個人理解為一個修復(fù)eslint導(dǎo)致編輯器打開文件異常的組件 https://www.npmjs.com/package/eslint-friendly-formatter
    "eslint-loader": "^1.7.1", //eslint加載器剂癌，類似babel-loder功能
    "eslint-plugin-html": "^2.0.0", //
    "eslint-config-standard": "^6.2.1", //eslint的一個js標(biāo)準(zhǔn)樣式配置組件淤翔，用于配置如何規(guī)定js代碼規(guī)范的 http://npm.taobao.org/package/eslint-config-standard
    "eslint-plugin-promise": "^3.4.0", //不清楚：難道是針對js的promise功能單獨(dú)搞的組件？ 請高手回復(fù) https://www.npmjs.com/package/eslint-plugin-promise
    "eslint-plugin-standard": "^2.0.1", //eslint標(biāo)準(zhǔn)生產(chǎn)組件 https://www.npmjs.com/package/eslint-plugin-standard
    "eventsource-polyfill": "^0.9.6", //不清楚：挺常見的單詞佩谷，難道是解決跨域請求問題的旁壮？ 請高手回復(fù) https://www.npmjs.com/package/eventsource
    "express": "^4.14.1", //一個nodeJS常用的框架，超好用谐檀，集成很多常用功能抡谐，類似jquery的能力
    "extract-text-webpack-plugin": "^2.0.0", //該組件可以解決webpak將css樣式打包到j(luò)s中出現(xiàn)樣式錯亂的問題 https://github.com/webpack-contrib/extract-text-webpack-plugin http://www.cnblogs.com/dyx-wx/p/6529447.html
    "file-loader": "^0.11.1", //webpack的文件加載組件，解決路徑問題的關(guān)鍵組件桐猬，
    "friendly-errors-webpack-plugin": "^1.1.3", //報錯的有個友好組件麦撵，當(dāng)有報錯，會將error信息顯示在可視區(qū)域
    "html-webpack-plugin": "^2.28.0", //幫助我們生成最終html文件的一個組件 https://www.npmjs.com/package/html-webpack-plugin
    "http-proxy-middleware": "^0.17.3", //http代理中間件溃肪，這里用于輔助解決路徑問題 https://www.npmjs.com/package/http-proxy-middleware
    "webpack-bundle-analyzer": "^2.2.1", //很有意思的一個組件免胃，用于優(yōu)化壓縮和查找錯誤模塊 https://www.npmjs.com/package/webpack-bundle-analyzer
    "semver": "^5.3.0", //不清楚：難道是版本規(guī)范工具？ http://semver.org/lang/zh-CN/
    "shelljs": "^0.7.6", //為nodeJS提供的一個仿UNIX的shell命令的組件 https://www.npmjs.com/package/shelljs
    "opn": "^4.0.2", //為nodeJS提供的一個跨平臺打開文件的方法惫撰，
    "optimize-css-assets-webpack-plugin": "^1.3.0", //
    "ora": "^1.2.0", //不清楚：難道是提供一個識別參數(shù)文件的后綴功能羔沙？ https://zhidao.baidu.com/question/581436199.html
    "rimraf": "^2.6.0", //為nodeJS提供的一個UNIX命令，rm -rf 移除文件的功能
    "url-loader": "^0.5.8", //功能同file-loader厨钻，不過在它基礎(chǔ)上增加了小于8kb的圖片直接轉(zhuǎn)換成base64碼寫進(jìn)js扼雏，減少圖片請求，節(jié)約資源
    "vue-loader": "^11.3.4", // vue的加載工具莉撇，它允許我們使用vue的格式寫文件 https://github.com/vuejs/vue-loader
    "vue-style-loader": "^2.0.5", //webpack的vue.js樣式加載模塊 http://npm.taobao.org/package/vue-style-loader
    "vue-template-compiler": "^2.2.6", //vue編譯模板呢蛤，用于將vue2.0+編譯成可供瀏覽器渲染的常規(guī)正常函數(shù) https://npm.taobao.org/package/vue-template-compiler
    "webpack": "^2.3.3", //一款打包工具，還有其他功能棍郎，例如路徑處理等
    "webpack-dev-middleware": "^1.10.0", //本地改動其障，webpack相關(guān)功能都會實(shí)時刷新 https://github.com/webpack/webpack-dev-middleware
    "webpack-hot-middleware": "^2.18.0", //開發(fā)時特有的一個中間件，我們本地測試文件的改動都會實(shí)時在內(nèi)存緩存里存儲涂佃，并沒有寫入磁盤励翼；
    "webpack-merge": "^4.1.0" //webpack合并文件的組件蜈敢，我們寫很多js文件，最后webpack會將它們合并成一個js汽抚，減少網(wǎng)絡(luò)請求次數(shù) https://www.npmjs.com/package/webpack-merge
  },
  "engines": { // 引擎相關(guān)的內(nèi)容
    "node": ">= 4.0.0", //要求node版本要大于指定版本抓狭，否則不給你運(yùn)行~
    "npm": ">= 3.0.0" //要求npm版本大于指定版本
  },
  "browserslist": [ // 配置瀏覽器的信息查詢范圍，這些信息將給Autoprefixer babel-env-preset eslint-plugin-compat這些組件來使用 https://www.npmjs.com/package/browserslist
    "> 1%", //
    "last 2 versions", //每種瀏覽器的最近的兩個版本
    "not ie <= 8" //IE8及以下版本不查詢
  ]
}