遇到bug之前
前兩天在學(xué)習(xí)express承耿，因?yàn)橹坝眠^express，所以就簡(jiǎn)單的看了一下express的使用伪煤，然后就用react+webpack+express搭建一個(gè)框架加袋，剛開始的目錄結(jié)構(gòu)是這樣的：
out目錄下的bundle.js是用webpack打包之后的入口文件。
在加express之前react+webpack是沒有任何問題的带族，那么我加了express锁荔，就只是加了一個(gè)server.js蟀给，里面的內(nèi)容是這樣的：
const express = require('express');
const app = express();
app.use(express.static(__dirname + '/public'));
app.get('/', function (req, res) {
res.sendFile(__dirname +'/index.html');
});
app.listen(3000, () => {
console.log('Server started.');
});
初遇bug
看起來沒有任何問題蝙砌，然而運(yùn)行結(jié)果是這樣的：
剛遇到這個(gè)問題的時(shí)候我有點(diǎn)懵阳堕，然后就開始了萬年不變的方式：
- 立馬Google，希望能找到問題的解決辦法择克，然而未果恬总。
- 和同窗討論，同未果肚邢。
- 向總理請(qǐng)教
其實(shí)在向總理請(qǐng)教之前壹堰，自己試著解決了很久，但是未果骡湖，所以
在大神的指點(diǎn)下才發(fā)現(xiàn)自己解決問題時(shí)的問題：
- 沒有了解錯(cuò)誤到底是什么贱纠，盲目的只求答案。
- 沒有深刻的理解自己的代碼响蕴。
重審bug
- 在Console這里單單憑這一句話是無法判斷錯(cuò)誤的谆焊，所以這時(shí)就可以打開Network來看一下到底是什么問題。
從這里可以看出來bundle.js是404浦夷，那么就可以發(fā)現(xiàn)錯(cuò)誤是404辖试，那么接下來想一下為什么會(huì)出現(xiàn)404呢？
- 判斷出現(xiàn)404的原因
首先第一個(gè)想到的肯定是端口的問題劈狐，所以就將3000端口替換為8080罐孝，再運(yùn)行程序，發(fā)現(xiàn)出現(xiàn)了一樣的錯(cuò)誤肥缔，那么說明并不是端口的問題莲兢。
接著就會(huì)想到會(huì)不會(huì)是路徑的問題，導(dǎo)致無法訪問bundle.js這個(gè)文件续膳。所以就需要重新審視一下代碼了怒见。 - 重審代碼
說起路徑那么就只有這兩條代碼是訪問路徑的：
app.use(express.static(__dirname + '/public'));
app.get('/', function (req, res) {
res.sendFile(__dirname +'/index.html');
});
那么先來看第一句，app.use(express.static(__dirname + '/public'));姑宽，這句代碼在教程中是這樣說的：設(shè)置靜態(tài)文件目錄遣耍。那么這是什么意思呢？express會(huì)根據(jù)靜態(tài)文件目錄去查找靜態(tài)文件炮车，所以靜態(tài)目錄就不需要作為URL的一部分了舵变，簡(jiǎn)而言之，你要訪問public文件夾下的文件瘦穆，那么你的URL就不需要有public纪隙，它默認(rèn)會(huì)去public下找你所需要的文件，比如你想要訪問public下的main.js文件扛或，那么你的URL就是http://localhost:3000/main.js绵咱，而不需要再加public。那么由這個(gè)可以推出熙兔，如果我想要訪問http://localhost:3000/out/bundle.js悲伶，那么就可以將out/bundle.js置于public下艾恼，所以就將文件目錄改為：
就完美的解決了剛才的那個(gè)bug！
學(xué)到
- 遇到問題一定要先找到原因麸锉，而不是盲目的去搜尋答案钠绍。
- 懂得看Network里面的內(nèi)容，而不是只看表面的錯(cuò)誤花沉。
- 遇到問題整理思路柳爽，一步一步去解決。
- 不管是學(xué)啥一定要懂得每一條代碼的意思碱屁，而不是只想著會(huì)用就好磷脯，不然遇到問題之后完全不知道到底是何原因造成的，其實(shí)遇到這個(gè)問題的時(shí)候有和朋友一起討論娩脾，并且也討論到了一個(gè)問題争拐，她說她express基礎(chǔ)學(xué)的不是很好，但是以前老師搭過的框架可以用晦雨，能用就可以了吧架曹，我當(dāng)時(shí)其實(shí)也差點(diǎn)放棄對(duì)這個(gè)問題的解決，也準(zhǔn)備拿著以前的框架在里面添東西來著闹瞧，在自己僅有的耐心下通過總理的指點(diǎn)還是完成了绑雄，所以其實(shí)并沒有什么是做不成的，只有自己想不想做而已奥邮。
