問(wèn)題描述

大家好，我又來(lái)了距離上次詢問(wèn)babel安裝已經(jīng)有一段時(shí)間了，惡補(bǔ)了一下有關(guān)于npm的知識(shí)，看阮一峰老師的教程終于不是那么懵逼了嘿嘿距離上一次提問(wèn)還是有進(jìn)步的/q/10...首先我創(chuàng)建了一個(gè)Babel文件夾

1 創(chuàng)建一個(gè).babelrc文件2 npm init 一直點(diǎn)回車創(chuàng)建了一個(gè)package.json文件3 安裝npm install --save-dev babel-preset-es2015

npm install --save-dev babel-preset-react 寫(xiě)入.babelrc中

安裝 npm install --save-dev babel-cli改寫(xiě)package.json文件，添加scripts用于npm run執(zhí)行的時(shí)候用到

此時(shí)的目錄結(jié)構(gòu)，在hello.js中寫(xiě)了一個(gè)類 class Foo{},到這里都一帆風(fēng)順

參考阮一峰老師的教程npm run build的時(shí)候報(bào)錯(cuò)，babel-node也不好用，有點(diǎn)讓我不明白首先我嘗試刪除lib文件夾 依然報(bào)錯(cuò)，然后看錯(cuò)誤信息，確保安裝的是最新版本的node和npm，這個(gè)沒(méi)問(wèn)題從官網(wǎng)上下的最新版本,npm也是3.10.10. 可能是demo這個(gè)package出了問(wèn)題，而不是npm本身。求如何解決感激不盡

問(wèn)題解答

你缺乏的是命令行的基本知識(shí)，無(wú)關(guān)乎 npm 還是 babel.

你的 npm run build 不成功的原因是，你沒(méi)有按照教程正確建立文件夾！！！

報(bào)錯(cuò)信息很明顯，“src doesn’t exist” ，src 目錄不存在啊親！讀不懂報(bào)錯(cuò)也是讓人糾結(jié)！

這就是別人告訴你這里錯(cuò)了，你看到了，偏不看進(jìn)腦子里，然后一直納悶我為啥錯(cuò)了啊為啥錯(cuò)了啊，可是人家分明已經(jīng)告訴你了啊，babel很蒙蔽啊，npm也很蒙蔽啊，babel說(shuō)勞資都找不到 src 目錄 而且我都輸出了具體的錯(cuò)誤了啊 。。。。。。。

好我們回過(guò)頭來(lái)說(shuō)說(shuō)“命令行”。

命令一般對(duì)應(yīng)一個(gè)可執(zhí)行文件或者腳本文件，一般是一個(gè)字符串，你在shell或者cmd里敲入這個(gè)命令，就等價(jià)于你雙擊執(zhí)行這個(gè)可執(zhí)行文件。命令后面跟的東西，叫“參數(shù)”。系統(tǒng)怎么知道有沒(méi)有某個(gè)命令呢？簡(jiǎn)單理解吧，有兩個(gè)地方系統(tǒng)回去尋找，全局目錄和相對(duì)目錄。比如cmd里，光標(biāo)前面有個(gè)'路徑>',這個(gè)是你的當(dāng)前路徑。你輸入 npm 這個(gè)命令，系統(tǒng)會(huì)先查找當(dāng)前目錄有沒(méi)有npm這個(gè)可執(zhí)行文件，然后查找全局路徑下有沒(méi)有npm，你裝node的時(shí)候npm被安裝到了全局，所以npm被找到了，順利執(zhí)行。

好我們來(lái)具體解釋一下 npm run 這個(gè)命令。 npm run 會(huì)查找當(dāng)前目錄下的package.json，找到 script 這個(gè)字段里配置的命令。這個(gè)你已經(jīng)知道里。有一個(gè)你不知道的，npm run 會(huì)把當(dāng)前目錄下的 node_modules/.bin 目錄臨時(shí)地加到當(dāng)前的系統(tǒng)查找路徑列表里，也就是說(shuō)，npm run build，build我們配置的命令是“babel src -d lib”, 系統(tǒng)會(huì)被要求執(zhí)行這個(gè)我們配置好的命令。babel這個(gè)字符是一個(gè)命令，系統(tǒng)不識(shí)別它，所以要查找有沒(méi)有對(duì)應(yīng)的可執(zhí)行文件，當(dāng)前目錄下沒(méi)有，因此會(huì)搜索 node_modules/.bin 這個(gè)目錄，如果這個(gè)也沒(méi)有，系統(tǒng)會(huì)搜索全局目錄。 記住 node_modules/.bin 這個(gè)查找邏輯只有在 npm run 里執(zhí)行的才會(huì)有。

npm install --save-dev babel-cli 會(huì)把babel-cli安裝到項(xiàng)目目錄下的node_modules里，因此npm run build 可以正常執(zhí)行。npm run build這時(shí)候等價(jià)于: project_dir> node_modules/.bin/babel src -d lib

再來(lái)說(shuō)說(shuō) babel 命令，src -d lib，這個(gè)不看babel文檔也能猜到， src是源目錄，是告訴babel讓它處理 src 目錄下的js，-d 表示我要聲明目標(biāo)目錄參數(shù)啦，lib是目標(biāo)目錄參數(shù)的值，也就是告訴babel把src目錄下的js轉(zhuǎn)義到lib目錄。

這是命令行的基本使用能力。。。

babel如果不是全局安裝，不能直接在控制臺(tái)用 可以通過(guò)npm 腳本的方式調(diào)用