[{"data":1,"prerenderedAt":2080},["ShallowReactive",2],{"\u002Fpost\u002Flegacy-project-optimization":3},{"id":4,"title":5,"body":6,"date":2061,"description":12,"extension":2062,"hidden":2063,"image":2064,"meta":2065,"navigation":257,"path":2066,"seo":2067,"sitemap":2068,"stem":2072,"subtitle":2073,"tags":2074,"__hash__":2079},"posts\u002Fpost\u002Flegacy-project-optimization.md","我配置了webpack的設置，讓編譯的時間減少超過一半以上的時間",{"type":7,"value":8,"toc":2050},"minimark",[9,13,21,24,130,133,139,144,156,159,162,182,979,982,986,991,1003,1006,1010,1019,1023,1604,1608,2011,2014,2020,2023,2026,2030,2046],[10,11,12],"p",{},"最近公司內部的專案在開發熱起動時，花費的時間越來越久",[10,14,15,16,20],{},"專案 vue2 搭配 element-ui 然後還有許多大大小小的套件，這個專案主要是做報表系統，有 ",[17,18,19],"code",{},"70+","以上的頁面，",[10,22,23],{},"相對應的 component 也好幾百個，再配合上 webpack + babel 的編譯，\n所以光是起 server 就花的將近 55 秒的時間",[25,26,31],"pre",{"className":27,"code":28,"language":29,"meta":30,"style":30},"language-bash shiki shiki-themes light-plus tokyo-night","\u002F\u002F Usage library && framework\n\"vue\": \"2.6.10\",\n\"@vue\u002Fcli-service\": \"3.5.3\",\n\"element-ui\": \"2.13.0\",\n\"moment\": \"2.29.1\",\n","bash","",[17,32,33,56,79,96,113],{"__ignoreMap":30},[34,35,38,42,46,49,53],"span",{"class":36,"line":37},"line",1,[34,39,41],{"class":40},"smeoz","\u002F\u002F",[34,43,45],{"class":44},"s58z3"," Usage",[34,47,48],{"class":44}," library",[34,50,52],{"class":51},"s6v6z"," &&",[34,54,55],{"class":40}," framework\n",[34,57,59,62,66,70,73,76],{"class":36,"line":58},2,[34,60,61],{"class":40},"\"vue\"",[34,63,65],{"class":64},"skq4w",":",[34,67,69],{"class":68},"sq7Q2"," \"",[34,71,72],{"class":44},"2.6.10",[34,74,75],{"class":68},"\"",[34,77,78],{"class":44},",\n",[34,80,82,85,87,89,92,94],{"class":36,"line":81},3,[34,83,84],{"class":40},"\"@vue\u002Fcli-service\"",[34,86,65],{"class":64},[34,88,69],{"class":68},[34,90,91],{"class":44},"3.5.3",[34,93,75],{"class":68},[34,95,78],{"class":44},[34,97,99,102,104,106,109,111],{"class":36,"line":98},4,[34,100,101],{"class":40},"\"element-ui\"",[34,103,65],{"class":64},[34,105,69],{"class":68},[34,107,108],{"class":44},"2.13.0",[34,110,75],{"class":68},[34,112,78],{"class":44},[34,114,116,119,121,123,126,128],{"class":36,"line":115},5,[34,117,118],{"class":40},"\"moment\"",[34,120,65],{"class":64},[34,122,69],{"class":68},[34,124,125],{"class":44},"2.29.1",[34,127,75],{"class":68},[34,129,78],{"class":44},[10,131,132],{},"最近專案需求剛好告一段落，所以開始著手研究相對應的優化",[134,135,136],"blockquote",{},[10,137,138],{},"這邊專注的是 DX(Development Experience)優化，並不是頁面的優化",[140,141,143],"h2",{"id":142},"我們先寫一個-webpack-plugin-來看啟動時間要耗時多久","我們先寫一個 webpack plugin 來看啟動時間要耗時多久",[10,145,146,147,151,152,155],{},"如此一來我們才能量化所需的時(",[148,149,150],"del",{},"績",")間(",[148,153,154],{},"效",")",[10,157,158],{},"先創建一個 ConsolelogPlugin.js，放在 root folder",[10,160,161],{},"需要的 library",[163,164,165,175],"ul",{},[166,167,168],"li",{},[169,170,174],"a",{"href":171,"rel":172},"https:\u002F\u002Fgithub.com\u002Fchalk\u002Fchalk#readme",[173],"nofollow","chalk",[166,176,177],{},[169,178,181],{"href":179,"rel":180},"https:\u002F\u002Fgithub.com\u002Ffreeall\u002Fsingle-line-log",[173],"single-line-log",[25,183,188],{"className":184,"code":185,"language":186,"meta":187,"style":30},"language-js shiki shiki-themes light-plus tokyo-night","\u002F\u002F ConsolelogPlugin.js\nconst chalk = require('chalk') \u002F* console 顏色 *\u002F\nconst slog = require('single-line-log') \u002F* 單行 Print console *\u002F\n\nclass ConsolegPlugin {\n  constructor(options) {\n    this.options = options\n  }\n  apply(compiler) {\n    \u002F**\n     * Monitor file change 記錄當前改動文件\n     *\u002F\n    compiler.hooks.watchRun.tap('ConsolePlugin', (watching) => {\n      const changeFiles = watching.watchFileSystem.watcher.mtimes\n      for (let file in changeFiles) {\n        console.log(chalk.green('當前改動文件：' + file))\n      }\n    })\n    \u002F**\n     *  before a new compilation is created.\n     *  開始 compilation 編譯 。\n     *\u002F\n    compiler.hooks.compile.tap('ConsolePlugin', () => {\n      this.beginCompile()\n    })\n    \u002F**\n     * Executed when the compilation has completed.\n     * 一次 compilation 完成。\n     *\u002F\n    compiler.hooks.done.tap('ConsolePlugin', () => {\n      this.timer && clearInterval(this.timer)\n      const endTime = new Date().getTime()\n      const time = (endTime - this.starTime) \u002F 1000\n      console.log(chalk.yellow(' 編譯完成'))\n      console.log(chalk.yellow('編譯用時：' + time + '秒'))\n    })\n  }\n  beginCompile() {\n    const lineSlog = slog.stdout\n    let text = '開始編譯：'\n    \u002F* 記錄開始時間 *\u002F\n    this.starTime = new Date().getTime()\n    this.timer = setInterval(() => {\n      text += '█'\n      lineSlog(chalk.green(text))\n    }, 50)\n  }\n}\n\nmodule.exports = ConsolegPlugin\n","js","showLineNumbers",[17,189,190,196,229,253,259,272,288,307,313,328,334,340,346,393,422,447,484,490,496,501,507,513,518,553,567,572,577,583,589,594,628,656,682,717,747,789,794,799,809,827,846,852,875,896,912,933,946,951,957,962],{"__ignoreMap":30},[34,191,192],{"class":36,"line":37},[34,193,195],{"class":194},"shM36","\u002F\u002F ConsolelogPlugin.js\n",[34,197,198,202,206,209,213,217,220,222,224,226],{"class":36,"line":58},[34,199,201],{"class":200},"sucPa","const",[34,203,205],{"class":204},"sq2Xa"," chalk",[34,207,208],{"class":51}," =",[34,210,212],{"class":211},"sjNAT"," require",[34,214,216],{"class":215},"sNwUV","(",[34,218,219],{"class":68},"'",[34,221,174],{"class":44},[34,223,219],{"class":68},[34,225,155],{"class":215},[34,227,228],{"class":194}," \u002F* console 顏色 *\u002F\n",[34,230,231,233,236,238,240,242,244,246,248,250],{"class":36,"line":81},[34,232,201],{"class":200},[34,234,235],{"class":204}," slog",[34,237,208],{"class":51},[34,239,212],{"class":211},[34,241,216],{"class":215},[34,243,219],{"class":68},[34,245,181],{"class":44},[34,247,219],{"class":68},[34,249,155],{"class":215},[34,251,252],{"class":194}," \u002F* 單行 Print console *\u002F\n",[34,254,255],{"class":36,"line":98},[34,256,258],{"emptyLinePlaceholder":257},true,"\n",[34,260,261,265,269],{"class":36,"line":115},[34,262,264],{"class":263},"s5MyL","class",[34,266,268],{"class":267},"s6M8u"," ConsolegPlugin",[34,270,271],{"class":215}," {\n",[34,273,275,278,280,284,286],{"class":36,"line":274},6,[34,276,277],{"class":263},"  constructor",[34,279,216],{"class":215},[34,281,283],{"class":282},"s_ePm","options",[34,285,155],{"class":215},[34,287,271],{"class":215},[34,289,291,295,298,301,303],{"class":36,"line":290},7,[34,292,294],{"class":293},"sDmOP","    this",[34,296,297],{"class":51},".",[34,299,283],{"class":300},"se0OL",[34,302,208],{"class":51},[34,304,306],{"class":305},"sJUHq"," options\n",[34,308,310],{"class":36,"line":309},8,[34,311,312],{"class":215},"  }\n",[34,314,316,319,321,324,326],{"class":36,"line":315},9,[34,317,318],{"class":211},"  apply",[34,320,216],{"class":215},[34,322,323],{"class":282},"compiler",[34,325,155],{"class":215},[34,327,271],{"class":215},[34,329,331],{"class":36,"line":330},10,[34,332,333],{"class":194},"    \u002F**\n",[34,335,337],{"class":36,"line":336},11,[34,338,339],{"class":194},"     * Monitor file change 記錄當前改動文件\n",[34,341,343],{"class":36,"line":342},12,[34,344,345],{"class":194},"     *\u002F\n",[34,347,349,352,354,357,359,362,364,367,369,371,374,376,379,382,385,388,391],{"class":36,"line":348},13,[34,350,351],{"class":305},"    compiler",[34,353,297],{"class":51},[34,355,356],{"class":300},"hooks",[34,358,297],{"class":51},[34,360,361],{"class":300},"watchRun",[34,363,297],{"class":51},[34,365,366],{"class":211},"tap",[34,368,216],{"class":215},[34,370,219],{"class":68},[34,372,373],{"class":44},"ConsolePlugin",[34,375,219],{"class":68},[34,377,378],{"class":51},",",[34,380,381],{"class":215}," (",[34,383,384],{"class":282},"watching",[34,386,387],{"class":215},") ",[34,389,390],{"class":263},"=>",[34,392,271],{"class":215},[34,394,396,399,402,404,407,409,412,414,417,419],{"class":36,"line":395},14,[34,397,398],{"class":200},"      const",[34,400,401],{"class":204}," changeFiles",[34,403,208],{"class":51},[34,405,406],{"class":305}," watching",[34,408,297],{"class":51},[34,410,411],{"class":305},"watchFileSystem",[34,413,297],{"class":51},[34,415,416],{"class":305},"watcher",[34,418,297],{"class":51},[34,420,421],{"class":300},"mtimes\n",[34,423,425,429,431,434,438,442,444],{"class":36,"line":424},15,[34,426,428],{"class":427},"swp_B","      for",[34,430,381],{"class":215},[34,432,433],{"class":200},"let",[34,435,437],{"class":436},"sY6z7"," file",[34,439,441],{"class":440},"s00W4"," in",[34,443,401],{"class":305},[34,445,446],{"class":215},") {\n",[34,448,450,453,455,458,460,462,464,467,469,471,474,476,479,481],{"class":36,"line":449},16,[34,451,452],{"class":305},"        console",[34,454,297],{"class":51},[34,456,457],{"class":211},"log",[34,459,216],{"class":215},[34,461,174],{"class":305},[34,463,297],{"class":51},[34,465,466],{"class":211},"green",[34,468,216],{"class":215},[34,470,219],{"class":68},[34,472,473],{"class":44},"當前改動文件：",[34,475,219],{"class":68},[34,477,478],{"class":51}," +",[34,480,437],{"class":305},[34,482,483],{"class":215},"))\n",[34,485,487],{"class":36,"line":486},17,[34,488,489],{"class":215},"      }\n",[34,491,493],{"class":36,"line":492},18,[34,494,495],{"class":215},"    })\n",[34,497,499],{"class":36,"line":498},19,[34,500,333],{"class":194},[34,502,504],{"class":36,"line":503},20,[34,505,506],{"class":194},"     *  before a new compilation is created.\n",[34,508,510],{"class":36,"line":509},21,[34,511,512],{"class":194},"     *  開始 compilation 編譯 。\n",[34,514,516],{"class":36,"line":515},22,[34,517,345],{"class":194},[34,519,521,523,525,527,529,532,534,536,538,540,542,544,546,549,551],{"class":36,"line":520},23,[34,522,351],{"class":305},[34,524,297],{"class":51},[34,526,356],{"class":300},[34,528,297],{"class":51},[34,530,531],{"class":300},"compile",[34,533,297],{"class":51},[34,535,366],{"class":211},[34,537,216],{"class":215},[34,539,219],{"class":68},[34,541,373],{"class":44},[34,543,219],{"class":68},[34,545,378],{"class":51},[34,547,548],{"class":215}," () ",[34,550,390],{"class":263},[34,552,271],{"class":215},[34,554,556,559,561,564],{"class":36,"line":555},24,[34,557,558],{"class":293},"      this",[34,560,297],{"class":51},[34,562,563],{"class":211},"beginCompile",[34,565,566],{"class":215},"()\n",[34,568,570],{"class":36,"line":569},25,[34,571,495],{"class":215},[34,573,575],{"class":36,"line":574},26,[34,576,333],{"class":194},[34,578,580],{"class":36,"line":579},27,[34,581,582],{"class":194},"     * Executed when the compilation has completed.\n",[34,584,586],{"class":36,"line":585},28,[34,587,588],{"class":194},"     * 一次 compilation 完成。\n",[34,590,592],{"class":36,"line":591},29,[34,593,345],{"class":194},[34,595,597,599,601,603,605,608,610,612,614,616,618,620,622,624,626],{"class":36,"line":596},30,[34,598,351],{"class":305},[34,600,297],{"class":51},[34,602,356],{"class":300},[34,604,297],{"class":51},[34,606,607],{"class":300},"done",[34,609,297],{"class":51},[34,611,366],{"class":211},[34,613,216],{"class":215},[34,615,219],{"class":68},[34,617,373],{"class":44},[34,619,219],{"class":68},[34,621,378],{"class":51},[34,623,548],{"class":215},[34,625,390],{"class":263},[34,627,271],{"class":215},[34,629,631,633,635,638,641,644,646,649,651,653],{"class":36,"line":630},31,[34,632,558],{"class":293},[34,634,297],{"class":51},[34,636,637],{"class":300},"timer",[34,639,52],{"class":640},"sny2E",[34,642,643],{"class":211}," clearInterval",[34,645,216],{"class":215},[34,647,648],{"class":293},"this",[34,650,297],{"class":51},[34,652,637],{"class":300},[34,654,655],{"class":215},")\n",[34,657,659,661,664,666,669,672,675,677,680],{"class":36,"line":658},32,[34,660,398],{"class":200},[34,662,663],{"class":204}," endTime",[34,665,208],{"class":51},[34,667,668],{"class":440}," new",[34,670,671],{"class":211}," Date",[34,673,674],{"class":215},"()",[34,676,297],{"class":51},[34,678,679],{"class":211},"getTime",[34,681,566],{"class":215},[34,683,685,687,690,692,694,697,700,703,705,708,710,713],{"class":36,"line":684},33,[34,686,398],{"class":200},[34,688,689],{"class":204}," time",[34,691,208],{"class":51},[34,693,381],{"class":215},[34,695,696],{"class":305},"endTime",[34,698,699],{"class":51}," -",[34,701,702],{"class":293}," this",[34,704,297],{"class":51},[34,706,707],{"class":300},"starTime",[34,709,387],{"class":215},[34,711,712],{"class":51},"\u002F",[34,714,716],{"class":715},"sjYsg"," 1000\n",[34,718,720,723,725,727,729,731,733,736,738,740,743,745],{"class":36,"line":719},34,[34,721,722],{"class":305},"      console",[34,724,297],{"class":51},[34,726,457],{"class":211},[34,728,216],{"class":215},[34,730,174],{"class":305},[34,732,297],{"class":51},[34,734,735],{"class":211},"yellow",[34,737,216],{"class":215},[34,739,219],{"class":68},[34,741,742],{"class":44}," 編譯完成",[34,744,219],{"class":68},[34,746,483],{"class":215},[34,748,750,752,754,756,758,760,762,764,766,768,771,773,775,777,779,782,785,787],{"class":36,"line":749},35,[34,751,722],{"class":305},[34,753,297],{"class":51},[34,755,457],{"class":211},[34,757,216],{"class":215},[34,759,174],{"class":305},[34,761,297],{"class":51},[34,763,735],{"class":211},[34,765,216],{"class":215},[34,767,219],{"class":68},[34,769,770],{"class":44},"編譯用時：",[34,772,219],{"class":68},[34,774,478],{"class":51},[34,776,689],{"class":305},[34,778,478],{"class":51},[34,780,781],{"class":68}," '",[34,783,784],{"class":44},"秒",[34,786,219],{"class":68},[34,788,483],{"class":215},[34,790,792],{"class":36,"line":791},36,[34,793,495],{"class":215},[34,795,797],{"class":36,"line":796},37,[34,798,312],{"class":215},[34,800,802,805,807],{"class":36,"line":801},38,[34,803,804],{"class":211},"  beginCompile",[34,806,674],{"class":215},[34,808,271],{"class":215},[34,810,812,815,818,820,822,824],{"class":36,"line":811},39,[34,813,814],{"class":200},"    const",[34,816,817],{"class":204}," lineSlog",[34,819,208],{"class":51},[34,821,235],{"class":305},[34,823,297],{"class":51},[34,825,826],{"class":300},"stdout\n",[34,828,830,833,836,838,840,843],{"class":36,"line":829},40,[34,831,832],{"class":200},"    let",[34,834,835],{"class":436}," text",[34,837,208],{"class":51},[34,839,781],{"class":68},[34,841,842],{"class":44},"開始編譯：",[34,844,845],{"class":68},"'\n",[34,847,849],{"class":36,"line":848},41,[34,850,851],{"class":194},"    \u002F* 記錄開始時間 *\u002F\n",[34,853,855,857,859,861,863,865,867,869,871,873],{"class":36,"line":854},42,[34,856,294],{"class":293},[34,858,297],{"class":51},[34,860,707],{"class":300},[34,862,208],{"class":51},[34,864,668],{"class":440},[34,866,671],{"class":211},[34,868,674],{"class":215},[34,870,297],{"class":51},[34,872,679],{"class":211},[34,874,566],{"class":215},[34,876,878,880,882,884,886,889,892,894],{"class":36,"line":877},43,[34,879,294],{"class":293},[34,881,297],{"class":51},[34,883,637],{"class":300},[34,885,208],{"class":51},[34,887,888],{"class":211}," setInterval",[34,890,891],{"class":215},"(() ",[34,893,390],{"class":263},[34,895,271],{"class":215},[34,897,899,902,905,907,910],{"class":36,"line":898},44,[34,900,901],{"class":305},"      text",[34,903,904],{"class":51}," +=",[34,906,781],{"class":68},[34,908,909],{"class":44},"█",[34,911,845],{"class":68},[34,913,915,918,920,922,924,926,928,931],{"class":36,"line":914},45,[34,916,917],{"class":211},"      lineSlog",[34,919,216],{"class":215},[34,921,174],{"class":305},[34,923,297],{"class":51},[34,925,466],{"class":211},[34,927,216],{"class":215},[34,929,930],{"class":305},"text",[34,932,483],{"class":215},[34,934,936,939,941,944],{"class":36,"line":935},46,[34,937,938],{"class":215},"    }",[34,940,378],{"class":51},[34,942,943],{"class":715}," 50",[34,945,655],{"class":215},[34,947,949],{"class":36,"line":948},47,[34,950,312],{"class":215},[34,952,954],{"class":36,"line":953},48,[34,955,956],{"class":215},"}\n",[34,958,960],{"class":36,"line":959},49,[34,961,258],{"emptyLinePlaceholder":257},[34,963,965,969,971,974,976],{"class":36,"line":964},50,[34,966,968],{"class":967},"sX0bS","module",[34,970,297],{"class":51},[34,972,973],{"class":967},"exports",[34,975,208],{"class":51},[34,977,978],{"class":305}," ConsolegPlugin\n",[10,980,981],{},"已經能測量出所耗時的時間後，接下來進入主題",[140,983,985],{"id":984},"利用-緩存-loader-的執行結果-利用多核心-cpu-的效能加速","利用 緩存 loader 的執行結果 + 利用多核心 CPU 的效能加速",[987,988,990],"h3",{"id":989},"緩存-loader-的執行結果","緩存 loader 的執行結果",[10,992,993,998],{},[994,995],"img",{"alt":996,"src":997},"webpack babel setting","\u002Fimages\u002Fpost\u002Flegacy-project-optimization\u002Fg3.webp",[169,999,1002],{"href":1000,"rel":1001},"https:\u002F\u002Fwebpack.docschina.org\u002Floaders\u002Fbabel-loader#babel-loader-is-slow",[173],"Source",[10,1004,1005],{},"我們可以加上 cacheDirectory 的選項來 cache 之前編譯過的檔案，減少 webpack 構建時 Babel 重新編譯過程",[987,1007,1009],{"id":1008},"利用多核心-cpu-的效能加速","利用多核心 CPU 的效能加速",[10,1011,1012,1013,1018],{},"接下來我們使用",[169,1014,1017],{"href":1015,"rel":1016},"https:\u002F\u002Fgithub.com\u002Famireh\u002Fhappypack#readme",[173],"HappyPack","搭配 babel-loader 的 cache 來加速",[987,1020,1022],{"id":1021},"vue2-cli-版本webpack","Vue2 cli 版本(Webpack)",[25,1024,1026],{"className":184,"code":1025,"language":186,"meta":187,"style":30},"\u002F\u002F vue.config.js\n\n\u002F\u002F import .. from ..\n\u002F\u002F import ... from ...\nconst ConsolelogPlugin = require('.\u002FConsolelogPlugin')\nconst HappyPack = require('happypack');\nconst os = require('os')\nconst happyThreadPool = HappyPack.ThreadPool({ size: os.cpus().length })\n\nmodule.exports = {\n\n  \u002F\u002F ....\n  \u002F\u002F ......\n  configureWebpack: {\n\n    \u002F\u002F ....\n    plugins: [\n      new ConsolelogPlugin()\n    ]\n\n    chainWebpack(config) {\n        \u002F\u002F ...\n        \u002F\u002F 只想在 development 的環境執行\n        config.when(process.env.NODE_ENV === 'development', config => {\n            config.plugin('happypack')\n                .use(HappyPack)\n                .tap(options => {\n                options[0] = {\n                    id: 'babel',\n                    loaders: ['babel-loader?cacheDirectory=true'], \u002F\u002F 开启缓存\n                    threadPool: happyThreadPool\n                }\n                return options\n                })\n            const hRule = config.module.rule('js')\n            hRule.test(\u002F\\.js$\u002F)\n                .include.add(resolve('src'))\n                .end()\n            hRule.uses.clear()\n            hRule.use('happypack\u002Floader?id=babel')\n                .loader('happypack\u002Floader?id=babel')\n                .end()\n        })\n    }\n  }\n}\n",[17,1027,1028,1033,1037,1042,1047,1069,1094,1116,1159,1163,1175,1179,1184,1189,1198,1202,1207,1217,1226,1231,1235,1249,1254,1259,1289,1309,1323,1337,1356,1373,1398,1408,1413,1421,1426,1457,1487,1515,1524,1540,1559,1576,1584,1591,1596,1600],{"__ignoreMap":30},[34,1029,1030],{"class":36,"line":37},[34,1031,1032],{"class":194},"\u002F\u002F vue.config.js\n",[34,1034,1035],{"class":36,"line":58},[34,1036,258],{"emptyLinePlaceholder":257},[34,1038,1039],{"class":36,"line":81},[34,1040,1041],{"class":194},"\u002F\u002F import .. from ..\n",[34,1043,1044],{"class":36,"line":98},[34,1045,1046],{"class":194},"\u002F\u002F import ... from ...\n",[34,1048,1049,1051,1054,1056,1058,1060,1062,1065,1067],{"class":36,"line":115},[34,1050,201],{"class":200},[34,1052,1053],{"class":204}," ConsolelogPlugin",[34,1055,208],{"class":51},[34,1057,212],{"class":211},[34,1059,216],{"class":215},[34,1061,219],{"class":68},[34,1063,1064],{"class":44},".\u002FConsolelogPlugin",[34,1066,219],{"class":68},[34,1068,655],{"class":215},[34,1070,1071,1073,1076,1078,1080,1082,1084,1087,1089,1091],{"class":36,"line":274},[34,1072,201],{"class":200},[34,1074,1075],{"class":204}," HappyPack",[34,1077,208],{"class":51},[34,1079,212],{"class":211},[34,1081,216],{"class":215},[34,1083,219],{"class":68},[34,1085,1086],{"class":44},"happypack",[34,1088,219],{"class":68},[34,1090,155],{"class":215},[34,1092,1093],{"class":51},";\n",[34,1095,1096,1098,1101,1103,1105,1107,1109,1112,1114],{"class":36,"line":290},[34,1097,201],{"class":200},[34,1099,1100],{"class":204}," os",[34,1102,208],{"class":51},[34,1104,212],{"class":211},[34,1106,216],{"class":215},[34,1108,219],{"class":68},[34,1110,1111],{"class":44},"os",[34,1113,219],{"class":68},[34,1115,655],{"class":215},[34,1117,1118,1120,1123,1125,1127,1129,1132,1135,1139,1142,1144,1146,1149,1151,1153,1156],{"class":36,"line":309},[34,1119,201],{"class":200},[34,1121,1122],{"class":204}," happyThreadPool",[34,1124,208],{"class":51},[34,1126,1075],{"class":305},[34,1128,297],{"class":51},[34,1130,1131],{"class":211},"ThreadPool",[34,1133,1134],{"class":215},"({",[34,1136,1138],{"class":1137},"sF_0_"," size",[34,1140,65],{"class":1141},"s4YYt",[34,1143,1100],{"class":305},[34,1145,297],{"class":51},[34,1147,1148],{"class":211},"cpus",[34,1150,674],{"class":215},[34,1152,297],{"class":51},[34,1154,1155],{"class":300},"length",[34,1157,1158],{"class":215}," })\n",[34,1160,1161],{"class":36,"line":315},[34,1162,258],{"emptyLinePlaceholder":257},[34,1164,1165,1167,1169,1171,1173],{"class":36,"line":330},[34,1166,968],{"class":967},[34,1168,297],{"class":51},[34,1170,973],{"class":967},[34,1172,208],{"class":51},[34,1174,271],{"class":215},[34,1176,1177],{"class":36,"line":336},[34,1178,258],{"emptyLinePlaceholder":257},[34,1180,1181],{"class":36,"line":342},[34,1182,1183],{"class":194},"  \u002F\u002F ....\n",[34,1185,1186],{"class":36,"line":348},[34,1187,1188],{"class":194},"  \u002F\u002F ......\n",[34,1190,1191,1194,1196],{"class":36,"line":395},[34,1192,1193],{"class":1137},"  configureWebpack",[34,1195,65],{"class":1141},[34,1197,271],{"class":215},[34,1199,1200],{"class":36,"line":424},[34,1201,258],{"emptyLinePlaceholder":257},[34,1203,1204],{"class":36,"line":449},[34,1205,1206],{"class":194},"    \u002F\u002F ....\n",[34,1208,1209,1212,1214],{"class":36,"line":486},[34,1210,1211],{"class":1137},"    plugins",[34,1213,65],{"class":1141},[34,1215,1216],{"class":215}," [\n",[34,1218,1219,1222,1224],{"class":36,"line":492},[34,1220,1221],{"class":440},"      new",[34,1223,1053],{"class":211},[34,1225,566],{"class":215},[34,1227,1228],{"class":36,"line":498},[34,1229,1230],{"class":215},"    ]\n",[34,1232,1233],{"class":36,"line":503},[34,1234,258],{"emptyLinePlaceholder":257},[34,1236,1237,1240,1242,1245,1247],{"class":36,"line":509},[34,1238,1239],{"class":211},"    chainWebpack",[34,1241,216],{"class":215},[34,1243,1244],{"class":305},"config",[34,1246,155],{"class":215},[34,1248,271],{"class":215},[34,1250,1251],{"class":36,"line":515},[34,1252,1253],{"class":194},"        \u002F\u002F ...\n",[34,1255,1256],{"class":36,"line":520},[34,1257,1258],{"class":194},"        \u002F\u002F 只想在 development 的環境執行\n",[34,1260,1261,1265,1269,1272,1274,1277,1279,1281,1284,1287],{"class":36,"line":555},[34,1262,1264],{"class":1263},"sQ1WQ","        config.when(process.env.",[34,1266,1268],{"class":1267},"sEHUx","NODE_ENV",[34,1270,1271],{"class":640}," ===",[34,1273,781],{"class":68},[34,1275,1276],{"class":44},"development",[34,1278,219],{"class":68},[34,1280,378],{"class":51},[34,1282,1283],{"class":282}," config",[34,1285,1286],{"class":263}," =>",[34,1288,271],{"class":215},[34,1290,1291,1294,1296,1299,1301,1303,1305,1307],{"class":36,"line":569},[34,1292,1293],{"class":305},"            config",[34,1295,297],{"class":51},[34,1297,1298],{"class":211},"plugin",[34,1300,216],{"class":215},[34,1302,219],{"class":68},[34,1304,1086],{"class":44},[34,1306,219],{"class":68},[34,1308,655],{"class":215},[34,1310,1311,1314,1317,1319,1321],{"class":36,"line":574},[34,1312,1313],{"class":51},"                .",[34,1315,1316],{"class":211},"use",[34,1318,216],{"class":215},[34,1320,1017],{"class":305},[34,1322,655],{"class":215},[34,1324,1325,1327,1329,1331,1333,1335],{"class":36,"line":579},[34,1326,1313],{"class":51},[34,1328,366],{"class":211},[34,1330,216],{"class":215},[34,1332,283],{"class":282},[34,1334,1286],{"class":263},[34,1336,271],{"class":215},[34,1338,1339,1342,1345,1348,1351,1354],{"class":36,"line":585},[34,1340,1341],{"class":305},"                options",[34,1343,1344],{"class":215},"[",[34,1346,1347],{"class":715},"0",[34,1349,1350],{"class":215},"] ",[34,1352,1353],{"class":51},"=",[34,1355,271],{"class":215},[34,1357,1358,1362,1364,1366,1369,1371],{"class":36,"line":591},[34,1359,1361],{"class":1360},"sCl7R","                    id",[34,1363,65],{"class":1141},[34,1365,781],{"class":68},[34,1367,1368],{"class":44},"babel",[34,1370,219],{"class":68},[34,1372,78],{"class":51},[34,1374,1375,1378,1380,1383,1385,1388,1390,1393,1395],{"class":36,"line":596},[34,1376,1377],{"class":1360},"                    loaders",[34,1379,65],{"class":1141},[34,1381,1382],{"class":215}," [",[34,1384,219],{"class":68},[34,1386,1387],{"class":44},"babel-loader?cacheDirectory=true",[34,1389,219],{"class":68},[34,1391,1392],{"class":215},"]",[34,1394,378],{"class":51},[34,1396,1397],{"class":194}," \u002F\u002F 开启缓存\n",[34,1399,1400,1403,1405],{"class":36,"line":630},[34,1401,1402],{"class":1360},"                    threadPool",[34,1404,65],{"class":1141},[34,1406,1407],{"class":305}," happyThreadPool\n",[34,1409,1410],{"class":36,"line":658},[34,1411,1412],{"class":215},"                }\n",[34,1414,1415,1419],{"class":36,"line":684},[34,1416,1418],{"class":1417},"svvEX","                return",[34,1420,306],{"class":305},[34,1422,1423],{"class":36,"line":719},[34,1424,1425],{"class":215},"                })\n",[34,1427,1428,1431,1434,1436,1438,1440,1442,1444,1447,1449,1451,1453,1455],{"class":36,"line":749},[34,1429,1430],{"class":200},"            const",[34,1432,1433],{"class":204}," hRule",[34,1435,208],{"class":51},[34,1437,1283],{"class":305},[34,1439,297],{"class":51},[34,1441,968],{"class":300},[34,1443,297],{"class":51},[34,1445,1446],{"class":211},"rule",[34,1448,216],{"class":215},[34,1450,219],{"class":68},[34,1452,186],{"class":44},[34,1454,219],{"class":68},[34,1456,655],{"class":215},[34,1458,1459,1462,1464,1467,1469,1472,1476,1479,1483,1485],{"class":36,"line":791},[34,1460,1461],{"class":305},"            hRule",[34,1463,297],{"class":51},[34,1465,1466],{"class":211},"test",[34,1468,216],{"class":215},[34,1470,712],{"class":1471},"sT5Vz",[34,1473,1475],{"class":1474},"s0zpT","\\.",[34,1477,186],{"class":1478},"sgNCg",[34,1480,1482],{"class":1481},"sfdgG","$",[34,1484,712],{"class":1471},[34,1486,655],{"class":215},[34,1488,1489,1491,1494,1496,1499,1501,1504,1506,1508,1511,1513],{"class":36,"line":796},[34,1490,1313],{"class":51},[34,1492,1493],{"class":305},"include",[34,1495,297],{"class":51},[34,1497,1498],{"class":211},"add",[34,1500,216],{"class":215},[34,1502,1503],{"class":211},"resolve",[34,1505,216],{"class":215},[34,1507,219],{"class":68},[34,1509,1510],{"class":44},"src",[34,1512,219],{"class":68},[34,1514,483],{"class":215},[34,1516,1517,1519,1522],{"class":36,"line":801},[34,1518,1313],{"class":51},[34,1520,1521],{"class":211},"end",[34,1523,566],{"class":215},[34,1525,1526,1528,1530,1533,1535,1538],{"class":36,"line":811},[34,1527,1461],{"class":305},[34,1529,297],{"class":51},[34,1531,1532],{"class":300},"uses",[34,1534,297],{"class":51},[34,1536,1537],{"class":211},"clear",[34,1539,566],{"class":215},[34,1541,1542,1544,1546,1548,1550,1552,1555,1557],{"class":36,"line":829},[34,1543,1461],{"class":305},[34,1545,297],{"class":51},[34,1547,1316],{"class":211},[34,1549,216],{"class":215},[34,1551,219],{"class":68},[34,1553,1554],{"class":44},"happypack\u002Floader?id=babel",[34,1556,219],{"class":68},[34,1558,655],{"class":215},[34,1560,1561,1563,1566,1568,1570,1572,1574],{"class":36,"line":848},[34,1562,1313],{"class":51},[34,1564,1565],{"class":211},"loader",[34,1567,216],{"class":215},[34,1569,219],{"class":68},[34,1571,1554],{"class":44},[34,1573,219],{"class":68},[34,1575,655],{"class":215},[34,1577,1578,1580,1582],{"class":36,"line":854},[34,1579,1313],{"class":51},[34,1581,1521],{"class":211},[34,1583,566],{"class":215},[34,1585,1586,1589],{"class":36,"line":877},[34,1587,1588],{"class":215},"        }",[34,1590,655],{"class":1263},[34,1592,1593],{"class":36,"line":898},[34,1594,1595],{"class":215},"    }\n",[34,1597,1598],{"class":36,"line":914},[34,1599,312],{"class":215},[34,1601,1602],{"class":36,"line":935},[34,1603,956],{"class":215},[987,1605,1607],{"id":1606},"react-webpack-4441","React (webpack 4.44.1)",[25,1609,1611],{"className":184,"code":1610,"language":186,"meta":187,"style":30},"\u002F\u002F webpack.config.dev.js\n\n\u002F\u002F ...\nconst ConsolelogPlugin = require('.\u002FConsolelogPlugin')\nconst HappyPack = require('happypack');\nconst os = require('os')\nconst happyThreadPool = HappyPack.ThreadPool({ size: os.cpus().length })\n\nmodule.exports = {\n\n    module: {\n        rules: [\n            \u002F\u002F 原本\n            \u002F\u002F {\n            \u002F\u002F     test: \u002F\\.jsx?$\u002F,\n            \u002F\u002F     exclude: \u002Fnode_modules\u002F,\n            \u002F\u002F     use: {\n            \u002F\u002F         loader: \"babel-loader\",\n            \u002F\u002F         options: {\n            \u002F\u002F             presets: [\"@babel\u002Fpreset-react\",\"@babel\u002Fpreset-env\"],\n            \u002F\u002F         },\n            \u002F\u002F     }\n            \u002F\u002F },\n\n            \u002F\u002F改為\n            {\n                test: \u002F\\.js?$\u002F,\n                exclude: \u002Fnode_modules\u002F,\n                use:['happypack\u002Floader?id=babel']\n            }\n        ]\n    }\n\n    \u002F\u002F ....\n    plugins: [\n        \u002F\u002F.... ,\n        \u002F\u002F .... ,\n        new HappyPack({\n            id:'babel', \u002F\u002F 這邊對應上面use的id\n            loaders:['babel-loader?cacheDirectory=true'], \u002F\u002F cache babel編譯過的檔案\n            threadPool: happyThreadPool\n        }),\n        new ConsolelogPlugin()\n    ]\n}\n",[17,1612,1613,1618,1622,1627,1647,1669,1689,1723,1727,1739,1743,1752,1761,1766,1771,1776,1781,1786,1791,1796,1801,1806,1811,1816,1820,1825,1830,1853,1869,1887,1892,1897,1901,1905,1909,1919,1924,1929,1939,1957,1979,1988,1995,2003,2007],{"__ignoreMap":30},[34,1614,1615],{"class":36,"line":37},[34,1616,1617],{"class":194},"\u002F\u002F webpack.config.dev.js\n",[34,1619,1620],{"class":36,"line":58},[34,1621,258],{"emptyLinePlaceholder":257},[34,1623,1624],{"class":36,"line":81},[34,1625,1626],{"class":194},"\u002F\u002F ...\n",[34,1628,1629,1631,1633,1635,1637,1639,1641,1643,1645],{"class":36,"line":98},[34,1630,201],{"class":200},[34,1632,1053],{"class":204},[34,1634,208],{"class":51},[34,1636,212],{"class":211},[34,1638,216],{"class":215},[34,1640,219],{"class":68},[34,1642,1064],{"class":44},[34,1644,219],{"class":68},[34,1646,655],{"class":215},[34,1648,1649,1651,1653,1655,1657,1659,1661,1663,1665,1667],{"class":36,"line":115},[34,1650,201],{"class":200},[34,1652,1075],{"class":204},[34,1654,208],{"class":51},[34,1656,212],{"class":211},[34,1658,216],{"class":215},[34,1660,219],{"class":68},[34,1662,1086],{"class":44},[34,1664,219],{"class":68},[34,1666,155],{"class":215},[34,1668,1093],{"class":51},[34,1670,1671,1673,1675,1677,1679,1681,1683,1685,1687],{"class":36,"line":274},[34,1672,201],{"class":200},[34,1674,1100],{"class":204},[34,1676,208],{"class":51},[34,1678,212],{"class":211},[34,1680,216],{"class":215},[34,1682,219],{"class":68},[34,1684,1111],{"class":44},[34,1686,219],{"class":68},[34,1688,655],{"class":215},[34,1690,1691,1693,1695,1697,1699,1701,1703,1705,1707,1709,1711,1713,1715,1717,1719,1721],{"class":36,"line":290},[34,1692,201],{"class":200},[34,1694,1122],{"class":204},[34,1696,208],{"class":51},[34,1698,1075],{"class":305},[34,1700,297],{"class":51},[34,1702,1131],{"class":211},[34,1704,1134],{"class":215},[34,1706,1138],{"class":1137},[34,1708,65],{"class":1141},[34,1710,1100],{"class":305},[34,1712,297],{"class":51},[34,1714,1148],{"class":211},[34,1716,674],{"class":215},[34,1718,297],{"class":51},[34,1720,1155],{"class":300},[34,1722,1158],{"class":215},[34,1724,1725],{"class":36,"line":309},[34,1726,258],{"emptyLinePlaceholder":257},[34,1728,1729,1731,1733,1735,1737],{"class":36,"line":315},[34,1730,968],{"class":967},[34,1732,297],{"class":51},[34,1734,973],{"class":967},[34,1736,208],{"class":51},[34,1738,271],{"class":215},[34,1740,1741],{"class":36,"line":330},[34,1742,258],{"emptyLinePlaceholder":257},[34,1744,1745,1748,1750],{"class":36,"line":336},[34,1746,1747],{"class":1137},"    module",[34,1749,65],{"class":1141},[34,1751,271],{"class":215},[34,1753,1754,1757,1759],{"class":36,"line":342},[34,1755,1756],{"class":1137},"        rules",[34,1758,65],{"class":1141},[34,1760,1216],{"class":215},[34,1762,1763],{"class":36,"line":348},[34,1764,1765],{"class":194},"            \u002F\u002F 原本\n",[34,1767,1768],{"class":36,"line":395},[34,1769,1770],{"class":194},"            \u002F\u002F {\n",[34,1772,1773],{"class":36,"line":424},[34,1774,1775],{"class":194},"            \u002F\u002F     test: \u002F\\.jsx?$\u002F,\n",[34,1777,1778],{"class":36,"line":449},[34,1779,1780],{"class":194},"            \u002F\u002F     exclude: \u002Fnode_modules\u002F,\n",[34,1782,1783],{"class":36,"line":486},[34,1784,1785],{"class":194},"            \u002F\u002F     use: {\n",[34,1787,1788],{"class":36,"line":492},[34,1789,1790],{"class":194},"            \u002F\u002F         loader: \"babel-loader\",\n",[34,1792,1793],{"class":36,"line":498},[34,1794,1795],{"class":194},"            \u002F\u002F         options: {\n",[34,1797,1798],{"class":36,"line":503},[34,1799,1800],{"class":194},"            \u002F\u002F             presets: [\"@babel\u002Fpreset-react\",\"@babel\u002Fpreset-env\"],\n",[34,1802,1803],{"class":36,"line":509},[34,1804,1805],{"class":194},"            \u002F\u002F         },\n",[34,1807,1808],{"class":36,"line":515},[34,1809,1810],{"class":194},"            \u002F\u002F     }\n",[34,1812,1813],{"class":36,"line":520},[34,1814,1815],{"class":194},"            \u002F\u002F },\n",[34,1817,1818],{"class":36,"line":555},[34,1819,258],{"emptyLinePlaceholder":257},[34,1821,1822],{"class":36,"line":569},[34,1823,1824],{"class":194},"            \u002F\u002F改為\n",[34,1826,1827],{"class":36,"line":574},[34,1828,1829],{"class":215},"            {\n",[34,1831,1832,1835,1837,1840,1842,1844,1847,1849,1851],{"class":36,"line":579},[34,1833,1834],{"class":1360},"                test",[34,1836,65],{"class":1141},[34,1838,1839],{"class":1471}," \u002F",[34,1841,1475],{"class":1474},[34,1843,186],{"class":1478},[34,1845,1846],{"class":51},"?",[34,1848,1482],{"class":1481},[34,1850,712],{"class":1471},[34,1852,78],{"class":51},[34,1854,1855,1858,1860,1862,1865,1867],{"class":36,"line":585},[34,1856,1857],{"class":1360},"                exclude",[34,1859,65],{"class":1141},[34,1861,1839],{"class":1471},[34,1863,1864],{"class":1478},"node_modules",[34,1866,712],{"class":1471},[34,1868,78],{"class":51},[34,1870,1871,1874,1876,1878,1880,1882,1884],{"class":36,"line":591},[34,1872,1873],{"class":1360},"                use",[34,1875,65],{"class":1141},[34,1877,1344],{"class":215},[34,1879,219],{"class":68},[34,1881,1554],{"class":44},[34,1883,219],{"class":68},[34,1885,1886],{"class":215},"]\n",[34,1888,1889],{"class":36,"line":596},[34,1890,1891],{"class":215},"            }\n",[34,1893,1894],{"class":36,"line":630},[34,1895,1896],{"class":215},"        ]\n",[34,1898,1899],{"class":36,"line":658},[34,1900,1595],{"class":215},[34,1902,1903],{"class":36,"line":684},[34,1904,258],{"emptyLinePlaceholder":257},[34,1906,1907],{"class":36,"line":719},[34,1908,1206],{"class":194},[34,1910,1911,1913,1916],{"class":36,"line":749},[34,1912,1211],{"class":305},[34,1914,1915],{"class":1263},": ",[34,1917,1918],{"class":215},"[\n",[34,1920,1921],{"class":36,"line":791},[34,1922,1923],{"class":194},"        \u002F\u002F.... ,\n",[34,1925,1926],{"class":36,"line":796},[34,1927,1928],{"class":194},"        \u002F\u002F .... ,\n",[34,1930,1931,1934,1936],{"class":36,"line":801},[34,1932,1933],{"class":440},"        new",[34,1935,1075],{"class":211},[34,1937,1938],{"class":215},"({\n",[34,1940,1941,1944,1946,1948,1950,1952,1954],{"class":36,"line":811},[34,1942,1943],{"class":1137},"            id",[34,1945,65],{"class":1141},[34,1947,219],{"class":68},[34,1949,1368],{"class":44},[34,1951,219],{"class":68},[34,1953,378],{"class":51},[34,1955,1956],{"class":194}," \u002F\u002F 這邊對應上面use的id\n",[34,1958,1959,1962,1964,1966,1968,1970,1972,1974,1976],{"class":36,"line":829},[34,1960,1961],{"class":1137},"            loaders",[34,1963,65],{"class":1141},[34,1965,1344],{"class":215},[34,1967,219],{"class":68},[34,1969,1387],{"class":44},[34,1971,219],{"class":68},[34,1973,1392],{"class":215},[34,1975,378],{"class":51},[34,1977,1978],{"class":194}," \u002F\u002F cache babel編譯過的檔案\n",[34,1980,1981,1984,1986],{"class":36,"line":848},[34,1982,1983],{"class":1137},"            threadPool",[34,1985,65],{"class":1141},[34,1987,1407],{"class":300},[34,1989,1990,1993],{"class":36,"line":854},[34,1991,1992],{"class":215},"        })",[34,1994,78],{"class":51},[34,1996,1997,1999,2001],{"class":36,"line":877},[34,1998,1933],{"class":440},[34,2000,1053],{"class":211},[34,2002,566],{"class":215},[34,2004,2005],{"class":36,"line":898},[34,2006,1230],{"class":215},[34,2008,2009],{"class":36,"line":914},[34,2010,956],{"class":215},[140,2012,2013],{"id":2013},"結論",[10,2015,2016],{},[994,2017],{"alt":2018,"src":2019},"React Router","\u002Fimages\u002Fpost\u002Flegacy-project-optimization\u002Fg2.webp",[10,2021,2022],{},"原本約 55 秒\n改進後約 16 秒\n只剩下原本不到 1\u002F3 的時間",[10,2024,2025],{},"當然修改後儲存的編譯時間也有變快\n但我這邊就不做記錄了",[140,2027,2029],{"id":2028},"ref","Ref",[163,2031,2032,2039],{},[166,2033,2034],{},[169,2035,2038],{"href":2036,"rel":2037},"https:\u002F\u002Fithelp.ithome.com.tw\u002Farticles\u002F10203713",[173],"HappyPack 介紹",[166,2040,2041],{},[169,2042,2045],{"href":2043,"rel":2044},"https:\u002F\u002Fjuejin.cn\u002Fpost\u002F6844903584933347335",[173],"webpack4.0 打包优化策略(一)",[2047,2048,2049],"style",{},"html pre.shiki code .smeoz, html code.shiki .smeoz{--shiki-default:#795E26;--shiki-dark:#C0CAF5}html pre.shiki code .s58z3, html code.shiki .s58z3{--shiki-default:#A31515;--shiki-dark:#9ECE6A}html pre.shiki code .s6v6z, html code.shiki .s6v6z{--shiki-default:#000000;--shiki-dark:#89DDFF}html pre.shiki code .skq4w, html code.shiki .skq4w{--shiki-default:#795E26;--shiki-dark:#0DB9D7}html pre.shiki code .sq7Q2, html code.shiki .sq7Q2{--shiki-default:#A31515;--shiki-dark:#89DDFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .shM36, html code.shiki .shM36{--shiki-default:#008000;--shiki-default-font-style:inherit;--shiki-dark:#51597D;--shiki-dark-font-style:italic}html pre.shiki code .sucPa, html code.shiki .sucPa{--shiki-default:#0000FF;--shiki-default-font-style:inherit;--shiki-dark:#9D7CD8;--shiki-dark-font-style:italic}html pre.shiki code .sq2Xa, html code.shiki .sq2Xa{--shiki-default:#0070C1;--shiki-dark:#BB9AF7}html pre.shiki code .sjNAT, html code.shiki .sjNAT{--shiki-default:#795E26;--shiki-dark:#7AA2F7}html pre.shiki code .sNwUV, html code.shiki .sNwUV{--shiki-default:#000000;--shiki-dark:#9ABDF5}html pre.shiki code .s5MyL, html code.shiki .s5MyL{--shiki-default:#0000FF;--shiki-dark:#BB9AF7}html pre.shiki code .s6M8u, html code.shiki .s6M8u{--shiki-default:#267F99;--shiki-dark:#C0CAF5}html pre.shiki code .s_ePm, html code.shiki .s_ePm{--shiki-default:#001080;--shiki-dark:#E0AF68}html pre.shiki code .sDmOP, html code.shiki .sDmOP{--shiki-default:#0000FF;--shiki-dark:#F7768E}html pre.shiki code .se0OL, html code.shiki .se0OL{--shiki-default:#001080;--shiki-dark:#7DCFFF}html pre.shiki code .sJUHq, html code.shiki .sJUHq{--shiki-default:#001080;--shiki-dark:#C0CAF5}html pre.shiki code .swp_B, html code.shiki .swp_B{--shiki-default:#AF00DB;--shiki-dark:#BB9AF7}html pre.shiki code .sY6z7, html code.shiki .sY6z7{--shiki-default:#001080;--shiki-dark:#BB9AF7}html pre.shiki code .s00W4, html code.shiki .s00W4{--shiki-default:#0000FF;--shiki-dark:#89DDFF}html pre.shiki code .sny2E, html code.shiki .sny2E{--shiki-default:#000000;--shiki-dark:#BB9AF7}html pre.shiki code .sjYsg, html code.shiki .sjYsg{--shiki-default:#098658;--shiki-dark:#FF9E64}html pre.shiki code .sX0bS, html code.shiki .sX0bS{--shiki-default:#267F99;--shiki-dark:#0DB9D7}html pre.shiki code .sF_0_, html code.shiki .sF_0_{--shiki-default:#001080;--shiki-dark:#73DACA}html pre.shiki code .s4YYt, html code.shiki .s4YYt{--shiki-default:#001080;--shiki-dark:#89DDFF}html pre.shiki code .sQ1WQ, html code.shiki .sQ1WQ{--shiki-default:#000000;--shiki-dark:#A9B1D6}html pre.shiki code .sEHUx, html code.shiki .sEHUx{--shiki-default:#0070C1;--shiki-dark:#FF9E64}html pre.shiki code .sCl7R, html code.shiki .sCl7R{--shiki-default:#001080;--shiki-dark:#41A6B5}html pre.shiki code .svvEX, html code.shiki .svvEX{--shiki-default:#AF00DB;--shiki-default-font-style:inherit;--shiki-dark:#BB9AF7;--shiki-dark-font-style:italic}html pre.shiki code .sT5Vz, html code.shiki .sT5Vz{--shiki-default:#811F3F;--shiki-dark:#89DDFF}html pre.shiki code .s0zpT, html code.shiki .s0zpT{--shiki-default:#EE0000;--shiki-dark:#C0CAF5}html pre.shiki code .sgNCg, html code.shiki .sgNCg{--shiki-default:#811F3F;--shiki-dark:#B4F9F8}html pre.shiki code .sfdgG, html code.shiki .sfdgG{--shiki-default:#EE0000;--shiki-dark:#BB9AF7}",{"title":30,"searchDepth":58,"depth":58,"links":2051},[2052,2053,2059,2060],{"id":142,"depth":58,"text":143},{"id":984,"depth":58,"text":985,"children":2054},[2055,2056,2057,2058],{"id":989,"depth":81,"text":990},{"id":1008,"depth":81,"text":1009},{"id":1021,"depth":81,"text":1022},{"id":1606,"depth":81,"text":1607},{"id":2013,"depth":58,"text":2013},{"id":2028,"depth":58,"text":2029},"2023-01-06","md",false,"\u002Fimages\u002Fpost\u002Flegacy-project-optimization\u002Fg1.webp",{},"\u002Fpost\u002Flegacy-project-optimization",{"title":5,"description":12},{"loc":2066,"images":2069},[2070,2071],{"loc":997},{"loc":2019},"post\u002Flegacy-project-optimization","webpack冷啟動要花55秒左右，熱啟動要花24秒左右",[2075,2076,2077,2078],"優化","vue2","react","webpack","cbRGmPqhL5-zYBwuWM-f0XuauGlC0j8A-k6458ajkPs",1791370767480]