最近在項(xiàng)目開(kāi)發(fā)過(guò)程中遇到一個(gè)很怪異的問(wèn)題：開(kāi)發(fā)環(huán)境中設(shè)置的字體樣式有效，使用webpack打包后失效鄙漏，導(dǎo)致本地字體正常嗤谚，線上字體異常，我用的是 “冬青黑體簡(jiǎn)體中文”怔蚌，
在控制臺(tái)巩步，對(duì)比發(fā)現(xiàn)：
線上： font-family: \51AC\9752\9ED1\4F53\7B80\4F53\4E2D\6587;
本地： font-family: "\51AC\9752\9ED1\4F53\7B80\4F53\4E2D\6587";
原來(lái)開(kāi)發(fā)環(huán)境的時(shí)候，"冬青黑體簡(jiǎn)體中文" 被解析成unicode編碼并且?guī)еp引號(hào)桦踊，是正確的
webpack打包以后椅野，"冬青黑體簡(jiǎn)體中文" 的雙引號(hào)被錯(cuò)誤解析并多加了個(gè)反斜杠，導(dǎo)致字體不生效
控制臺(tái)里籍胯，將字體改成 "\51AC\9752\9ED1\4F53\7B80\4F53\4E2D\6587"竟闪，就正常了，這就可以確定是webpack打包引起的問(wèn)題
解決方法：
使用中文字體的英文編碼杖狼，如：font-family: "Hiragino Sans GB"
問(wèn)題產(chǎn)生原因：
雖然一些常見(jiàn)中文字體炼蛤，例如“宋體”，“微軟雅黑”等蝶涩，直接使用中文名稱作為CSS font-family的屬性值也能生效理朋，但為了規(guī)避亂碼的風(fēng)險(xiǎn)絮识，建議使用字體的英文名稱。 還有一些中文字體嗽上，直接使用中文名稱作為 font-family的屬性值是沒(méi)有效果的笋除，如“思源黑體”， “蘭亭黑體”等炸裆，需要使用對(duì)應(yīng)的英文字體名稱才可以。
總而言之一句話鲜屏，你要想使用中文字體烹看，就必須要知道其對(duì)應(yīng)的英文名稱。
