當(dāng)我們建立好React項(xiàng)目后，npm start啟動(dòng)服務(wù)器查看http://localhost:3000。那么npm start后我們的經(jīng)過(guò)了怎樣的過(guò)程，為什么會(huì)查看3000而不是其他端口呢？
首先，我們看看當(dāng)npm start后我們服務(wù)器怎樣運(yùn)行
我們可以看到在npm start后，實(shí)際上我們服務(wù)器去了C:\Users\Administrator\react\myworkspace\shopping-front，然后運(yùn)行了react-scripts start。打開package.json，也就是這個(gè)項(xiàng)目所需要的各種模塊，以及項(xiàng)目的配置信息（比如名稱、版本、許可證等元數(shù)據(jù)）。我們發(fā)現(xiàn)
瞬間明白了。我們?cè)倩氐皆瓉?lái)的問(wèn)題上，為什么是3000端口？當(dāng)我們明白此時(shí)運(yùn)行的是react-scripts,對(duì)應(yīng)的找到項(xiàng)目中node_modules\react-scripts\bin\react-scripts.js
當(dāng)script值是start時(shí)，執(zhí)行‘../scripts/’+script,也就是\node_modules\react-scripts\scripts中的start.js。我們打開start.js
當(dāng)我們啟動(dòng)服務(wù)器，DEFAULT_PORT的默認(rèn)值是3000，我們?cè)L問(wèn)的就是默認(rèn)端口3000，這就是我們查看端口3000的原因。
再想想，我們?nèi)绻敫脑L問(wèn)端口又該怎么改？
第一種：直接在start.js上將端口改成其他，例如3001
DEFAULT_PORT=parseInt(process.env,PORT,10)||3001。
第二種：我們?cè)趐ackjson.json中將script中
"start": "react-scripts start",
改為
"start": "set PORT=3001&&react-scripts start",
我們npm start
同樣可以改變?cè)L問(wèn)端口。
