[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"knowledge-\u002Fapi\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fdeploy":3,"knowledge-related-\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fdeploy":2184,"knowledge-series-\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fdeploy":2208},{"source":4,"connector":5,"page":6},"sqlite","better-sqlite3",{"path":7,"title":8,"description":9,"category":10,"tags":11,"date":14,"pinned":15,"draft":15,"body":16,"seo":2180,"stem":2181,"id":2182,"extension":2183},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fdeploy","部署实践","Vite 项目的 CI\u002FCD、多环境、CDN、Legacy 与体积预算等工程化要点。环境变量见 env；构建见 生产构建。","技能小册",[12,13],"vite","deploy","2025-10-12",false,{"type":17,"value":18,"toc":2171},"minimark",[19,22,37,42,45,59,90,223,235,241,277,285,298,314,317,353,357,360,375,386,394,397,435,443,453,623,626,734,738,746,760,963,970,978,985,1118,1125,1129,1136,1142,1149,1170,1309,1316,1330,1400,1404,1409,1423,1426,1430,1433,1441,1448,1457,1602,1605,1618,1632,1928,1932,1954,1960,2010,2014,2108,2111,2114,2117,2167],[20,21,8],"h1",{"id":8},[23,24,25,26,31,32,36],"p",{},"Vite 项目的 CI\u002FCD、多环境、CDN、Legacy 与体积预算等工程化要点。环境变量见 ",[27,28,30],"a",{"href":29},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fproject\u002Fenv","env","；构建见 ",[27,33,35],{"href":34},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fbuild","生产构建","。",[38,39,41],"h3",{"id":40},"一ci-cd-优化","一、CI \u002F CD 优化",[23,43,44],{},"CI 环境通常需要快速、可复用的构建流程，避免不必要的重复工作。",[46,47,49,50,54,55,58],"h4",{"id":48},"_1-缓存-node_modules-和-vite-目录","1. 缓存 ",[51,52,53],"code",{},"node_modules"," 和 ",[51,56,57],{},".vite"," 目录",[60,61,62,79],"ul",{},[63,64,65,70,71,74,75,78],"li",{},[66,67,68],"strong",{},[51,69,53],{},"：依赖安装结果，可通过 CI 的缓存机制保留（如 GitHub Actions ",[51,72,73],{},"actions\u002Fcache","、GitLab CI ",[51,76,77],{},"cache","）。",[63,80,81,85,86,89],{},[66,82,83,58],{},[51,84,57],{},"：包含依赖预构建产物（",[51,87,88],{},"node_modules\u002F.vite\u002Fdeps","）和 vite 缓存，可大幅加速启动和构建。",[91,92,97],"pre",{"className":93,"code":94,"language":95,"meta":96,"style":96},"language-yaml shiki shiki-themes material-theme-lighter github-light github-dark","# GitHub Actions 示例\n- name: Cache node_modules\n  uses: actions\u002Fcache@v3\n  with:\n    path: node_modules\n    key: ${{ runner.os }}-node-${{ hashFiles('package-lock.json') }}\n\n- name: Cache Vite deps\n  uses: actions\u002Fcache@v3\n  with:\n    path: node_modules\u002F.vite\n    key: ${{ runner.os }}-vite-${{ hashFiles('package-lock.json') }}\n","yaml","",[51,98,99,108,126,137,146,157,168,175,187,196,203,213],{"__ignoreMap":96},[100,101,104],"span",{"class":102,"line":103},"line",1,[100,105,107],{"class":106},"sutJx","# GitHub Actions 示例\n",[100,109,111,115,119,122],{"class":102,"line":110},2,[100,112,114],{"class":113},"sP7_E","-",[100,116,118],{"class":117},"sQzsp"," name",[100,120,121],{"class":113},":",[100,123,125],{"class":124},"s_sjI"," Cache node_modules\n",[100,127,129,132,134],{"class":102,"line":128},3,[100,130,131],{"class":117},"  uses",[100,133,121],{"class":113},[100,135,136],{"class":124}," actions\u002Fcache@v3\n",[100,138,140,143],{"class":102,"line":139},4,[100,141,142],{"class":117},"  with",[100,144,145],{"class":113},":\n",[100,147,149,152,154],{"class":102,"line":148},5,[100,150,151],{"class":117},"    path",[100,153,121],{"class":113},[100,155,156],{"class":124}," node_modules\n",[100,158,160,163,165],{"class":102,"line":159},6,[100,161,162],{"class":117},"    key",[100,164,121],{"class":113},[100,166,167],{"class":124}," ${{ runner.os }}-node-${{ hashFiles('package-lock.json') }}\n",[100,169,171],{"class":102,"line":170},7,[100,172,174],{"emptyLinePlaceholder":173},true,"\n",[100,176,178,180,182,184],{"class":102,"line":177},8,[100,179,114],{"class":113},[100,181,118],{"class":117},[100,183,121],{"class":113},[100,185,186],{"class":124}," Cache Vite deps\n",[100,188,190,192,194],{"class":102,"line":189},9,[100,191,131],{"class":117},[100,193,121],{"class":113},[100,195,136],{"class":124},[100,197,199,201],{"class":102,"line":198},10,[100,200,142],{"class":117},[100,202,145],{"class":113},[100,204,206,208,210],{"class":102,"line":205},11,[100,207,151],{"class":117},[100,209,121],{"class":113},[100,211,212],{"class":124}," node_modules\u002F.vite\n",[100,214,216,218,220],{"class":102,"line":215},12,[100,217,162],{"class":117},[100,219,121],{"class":113},[100,221,222],{"class":124}," ${{ runner.os }}-vite-${{ hashFiles('package-lock.json') }}\n",[46,224,226,227,230,231,234],{"id":225},"_2-vite-build-前设置-citrue-避免交互式提示","2. ",[51,228,229],{},"vite build"," 前设置 ",[51,232,233],{},"CI=true"," 避免交互式提示",[23,236,237,238,240],{},"CI 环境应设置环境变量 ",[51,239,233],{},"，防止某些插件或工具输出交互式提示。",[91,242,246],{"className":243,"code":244,"language":245,"meta":96,"style":96},"language-bash shiki shiki-themes material-theme-lighter github-light github-dark","export CI=true\nnpm run build\n","bash",[51,247,248,265],{"__ignoreMap":96},[100,249,250,254,258,262],{"class":102,"line":103},[100,251,253],{"class":252},"sbsja","export",[100,255,257],{"class":256},"su5hD"," CI",[100,259,261],{"class":260},"smGrS","=",[100,263,264],{"class":256},"true\n",[100,266,267,271,274],{"class":102,"line":110},[100,268,270],{"class":269},"sbgvK","npm",[100,272,273],{"class":124}," run",[100,275,276],{"class":124}," build\n",[46,278,280,281,284],{"id":279},"_3-使用-emptyoutdir-控制输出目录清理","3. 使用 ",[51,282,283],{},"--emptyOutDir"," 控制输出目录清理",[23,286,287,288,291,292,294,295,36],{},"构建时默认会清空输出目录（",[51,289,290],{},"outDir","），可通过 ",[51,293,283],{}," 控制是否清空。CI 中通常保持默认清空，也可显式设置为 ",[51,296,297],{},"true",[91,299,301],{"className":243,"code":300,"language":245,"meta":96,"style":96},"vite build --emptyOutDir\n",[51,302,303],{"__ignoreMap":96},[100,304,305,307,310],{"class":102,"line":103},[100,306,12],{"class":269},[100,308,309],{"class":124}," build",[100,311,313],{"class":312},"stzsN"," --emptyOutDir\n",[23,315,316],{},"或在配置文件中指定：",[91,318,322],{"className":319,"code":320,"language":321,"meta":96,"style":96},"language-js shiki shiki-themes material-theme-lighter github-light github-dark","build: {\n  emptyOutDir: true;\n}\n","js",[51,323,324,334,348],{"__ignoreMap":96},[100,325,326,329,331],{"class":102,"line":103},[100,327,328],{"class":269},"build",[100,330,121],{"class":113},[100,332,333],{"class":113}," {\n",[100,335,336,339,341,345],{"class":102,"line":110},[100,337,338],{"class":269},"  emptyOutDir",[100,340,121],{"class":113},[100,342,344],{"class":343},"syTEX"," true",[100,346,347],{"class":113},";\n",[100,349,350],{"class":102,"line":128},[100,351,352],{"class":113},"}\n",[38,354,356],{"id":355},"二多环境配置拆分","二、多环境配置拆分",[23,358,359],{},"不同环境（开发、测试、预发、生产）需要不同的 API 地址、CDN 路径、调试开关等。",[46,361,363,364,54,367,370,371,374],{"id":362},"_1-通过-mode-和-define-importmetaenv-注入环境变量","1. 通过 ",[51,365,366],{},"mode",[51,368,369],{},"define"," \u002F ",[51,372,373],{},"import.meta.env"," 注入环境变量",[23,376,377,378,381,382,385],{},"使用 ",[51,379,380],{},".env.[mode]"," 文件存储环境特定变量，Vite 会自动加载并以 ",[51,383,384],{},"VITE_"," 前缀暴露。",[91,387,392],{"className":388,"code":390,"language":391},[389],"language-text","# .env.production\nVITE_API_BASE=https:\u002F\u002Fapi.prod.com\nVITE_CDN_BASE=https:\u002F\u002Fcdn.prod.com\n\n# .env.staging\nVITE_API_BASE=https:\u002F\u002Fapi.staging.com\n","text",[51,393,390],{"__ignoreMap":96},[23,395,396],{},"在代码中使用：",[91,398,400],{"className":319,"code":399,"language":321,"meta":96,"style":96},"const apiUrl = import.meta.env.VITE_API_BASE;\n",[51,401,402],{"__ignoreMap":96},[100,403,404,407,411,414,418,421,424,426,428,430,433],{"class":102,"line":103},[100,405,406],{"class":252},"const",[100,408,410],{"class":409},"s_hVV"," apiUrl",[100,412,413],{"class":260}," =",[100,415,417],{"class":416},"sVHd0"," import",[100,419,420],{"class":113},".",[100,422,423],{"class":409},"meta",[100,425,420],{"class":113},[100,427,30],{"class":256},[100,429,420],{"class":113},[100,431,432],{"class":409},"VITE_API_BASE",[100,434,347],{"class":113},[46,436,438,439,442],{"id":437},"_2-配置-config-钩子动态修改配置如不同环境使用不同-cdn-路径","2. 配置 ",[51,440,441],{},"config"," 钩子动态修改配置（如不同环境使用不同 CDN 路径）",[23,444,445,446,449,450,452],{},"如果需要在构建时根据环境改变 Vite 配置（如 base 路径、rollup 选项），可以在 ",[51,447,448],{},"vite.config.js"," 中使用 ",[51,451,441],{}," 钩子或直接导出函数。",[91,454,456],{"className":319,"code":455,"language":321,"meta":96,"style":96},"export default ({ mode, command }) => {\n  const isProd = mode === \"production\";\n  return {\n    base: isProd ? \"https:\u002F\u002Fcdn.example.com\u002F\" : \"\u002F\",\n    define: {\n      __CDN_BASE__: JSON.stringify(isProd ? \"https:\u002F\u002Fcdn.example.com\" : \"\"),\n    },\n    \u002F\u002F 其他配置...\n  };\n};\n",[51,457,458,486,513,520,553,562,603,608,613,618],{"__ignoreMap":96},[100,459,460,462,465,468,472,475,478,481,484],{"class":102,"line":103},[100,461,253],{"class":416},[100,463,464],{"class":416}," default",[100,466,467],{"class":113}," ({",[100,469,471],{"class":470},"s99_P"," mode",[100,473,474],{"class":113},",",[100,476,477],{"class":470}," command",[100,479,480],{"class":113}," })",[100,482,483],{"class":252}," =>",[100,485,333],{"class":113},[100,487,488,491,494,496,498,501,505,508,511],{"class":102,"line":110},[100,489,490],{"class":252},"  const",[100,492,493],{"class":409}," isProd",[100,495,413],{"class":260},[100,497,471],{"class":256},[100,499,500],{"class":260}," ===",[100,502,504],{"class":503},"sjJ54"," \"",[100,506,507],{"class":124},"production",[100,509,510],{"class":503},"\"",[100,512,347],{"class":113},[100,514,515,518],{"class":102,"line":128},[100,516,517],{"class":416},"  return",[100,519,333],{"class":113},[100,521,522,526,528,530,533,535,538,540,543,545,548,550],{"class":102,"line":139},[100,523,525],{"class":524},"skxfh","    base",[100,527,121],{"class":113},[100,529,493],{"class":256},[100,531,532],{"class":260}," ?",[100,534,504],{"class":503},[100,536,537],{"class":124},"https:\u002F\u002Fcdn.example.com\u002F",[100,539,510],{"class":503},[100,541,542],{"class":260}," :",[100,544,504],{"class":503},[100,546,547],{"class":124},"\u002F",[100,549,510],{"class":503},[100,551,552],{"class":113},",\n",[100,554,555,558,560],{"class":102,"line":148},[100,556,557],{"class":524},"    define",[100,559,121],{"class":113},[100,561,333],{"class":113},[100,563,564,567,569,572,574,578,581,584,586,588,591,593,595,598,601],{"class":102,"line":159},[100,565,566],{"class":524},"      __CDN_BASE__",[100,568,121],{"class":113},[100,570,571],{"class":409}," JSON",[100,573,420],{"class":113},[100,575,577],{"class":576},"sGLFI","stringify",[100,579,580],{"class":524},"(",[100,582,583],{"class":256},"isProd",[100,585,532],{"class":260},[100,587,504],{"class":503},[100,589,590],{"class":124},"https:\u002F\u002Fcdn.example.com",[100,592,510],{"class":503},[100,594,542],{"class":260},[100,596,597],{"class":503}," \"\"",[100,599,600],{"class":524},")",[100,602,552],{"class":113},[100,604,605],{"class":102,"line":170},[100,606,607],{"class":113},"    },\n",[100,609,610],{"class":102,"line":177},[100,611,612],{"class":106},"    \u002F\u002F 其他配置...\n",[100,614,615],{"class":102,"line":189},[100,616,617],{"class":113},"  };\n",[100,619,620],{"class":102,"line":198},[100,621,622],{"class":113},"};\n",[23,624,625],{},"也可以使用插件修改配置：",[91,627,629],{"className":319,"code":628,"language":321,"meta":96,"style":96},"{\n  name: 'dynamic-config',\n  config(config, env) {\n    if (env.mode === 'production') {\n      config.base = 'https:\u002F\u002Fcdn.prod.com\u002F';\n    }\n  }\n}\n",[51,630,631,636,654,673,699,720,725,730],{"__ignoreMap":96},[100,632,633],{"class":102,"line":103},[100,634,635],{"class":113},"{\n",[100,637,638,641,643,646,649,652],{"class":102,"line":110},[100,639,640],{"class":269},"  name",[100,642,121],{"class":113},[100,644,645],{"class":503}," '",[100,647,648],{"class":124},"dynamic-config",[100,650,651],{"class":503},"'",[100,653,552],{"class":113},[100,655,656,659,661,663,665,668,671],{"class":102,"line":128},[100,657,658],{"class":576},"  config",[100,660,580],{"class":524},[100,662,441],{"class":256},[100,664,474],{"class":113},[100,666,667],{"class":256}," env",[100,669,670],{"class":524},") ",[100,672,635],{"class":113},[100,674,675,678,681,683,685,687,689,691,693,695,697],{"class":102,"line":139},[100,676,677],{"class":416},"    if",[100,679,680],{"class":524}," (",[100,682,30],{"class":256},[100,684,420],{"class":113},[100,686,366],{"class":256},[100,688,500],{"class":260},[100,690,645],{"class":503},[100,692,507],{"class":124},[100,694,651],{"class":503},[100,696,670],{"class":524},[100,698,635],{"class":113},[100,700,701,704,706,709,711,713,716,718],{"class":102,"line":148},[100,702,703],{"class":256},"      config",[100,705,420],{"class":113},[100,707,708],{"class":256},"base",[100,710,413],{"class":260},[100,712,645],{"class":503},[100,714,715],{"class":124},"https:\u002F\u002Fcdn.prod.com\u002F",[100,717,651],{"class":503},[100,719,347],{"class":113},[100,721,722],{"class":102,"line":159},[100,723,724],{"class":113},"    }\n",[100,726,727],{"class":102,"line":170},[100,728,729],{"class":113},"  }\n",[100,731,732],{"class":102,"line":177},[100,733,352],{"class":113},[38,735,737],{"id":736},"三cdn-与资源上传","三、CDN 与资源上传",[46,739,741,742,745],{"id":740},"_1-使用-vite-plugin-cdn-import-自动替换外部依赖为-cdn","1. 使用 ",[51,743,744],{},"vite-plugin-cdn-import"," 自动替换外部依赖为 CDN",[23,747,748,749,752,753,752,756,759],{},"该插件将指定的依赖（如 ",[51,750,751],{},"vue","、",[51,754,755],{},"react",[51,757,758],{},"axios","）替换为 CDN 链接，减少打包体积并利用浏览器缓存。",[91,761,763],{"className":319,"code":762,"language":321,"meta":96,"style":96},"import { defineConfig } from \"vite\";\nimport cdnImport from \"vite-plugin-cdn-import\";\n\nexport default {\n  plugins: [\n    cdnImport({\n      modules: [\n        { name: \"vue\", var: \"Vue\", path: \"https:\u002F\u002Funpkg.com\u002Fvue@3\u002Fdist\u002Fvue.global.js\" },\n        { name: \"axios\", var: \"axios\", path: \"https:\u002F\u002Funpkg.com\u002Faxios\u002Fdist\u002Faxios.min.js\" },\n      ],\n    }),\n  ],\n};\n",[51,764,765,790,808,812,820,830,839,848,894,935,942,951,958],{"__ignoreMap":96},[100,766,767,770,773,776,779,782,784,786,788],{"class":102,"line":103},[100,768,769],{"class":416},"import",[100,771,772],{"class":113}," {",[100,774,775],{"class":256}," defineConfig",[100,777,778],{"class":113}," }",[100,780,781],{"class":416}," from",[100,783,504],{"class":503},[100,785,12],{"class":124},[100,787,510],{"class":503},[100,789,347],{"class":113},[100,791,792,794,797,800,802,804,806],{"class":102,"line":110},[100,793,769],{"class":416},[100,795,796],{"class":256}," cdnImport ",[100,798,799],{"class":416},"from",[100,801,504],{"class":503},[100,803,744],{"class":124},[100,805,510],{"class":503},[100,807,347],{"class":113},[100,809,810],{"class":102,"line":128},[100,811,174],{"emptyLinePlaceholder":173},[100,813,814,816,818],{"class":102,"line":139},[100,815,253],{"class":416},[100,817,464],{"class":416},[100,819,333],{"class":113},[100,821,822,825,827],{"class":102,"line":148},[100,823,824],{"class":524},"  plugins",[100,826,121],{"class":113},[100,828,829],{"class":256}," [\n",[100,831,832,835,837],{"class":102,"line":159},[100,833,834],{"class":576},"    cdnImport",[100,836,580],{"class":256},[100,838,635],{"class":113},[100,840,841,844,846],{"class":102,"line":170},[100,842,843],{"class":524},"      modules",[100,845,121],{"class":113},[100,847,829],{"class":256},[100,849,850,853,855,857,859,861,863,865,868,870,872,875,877,879,882,884,886,889,891],{"class":102,"line":177},[100,851,852],{"class":113},"        {",[100,854,118],{"class":524},[100,856,121],{"class":113},[100,858,504],{"class":503},[100,860,751],{"class":124},[100,862,510],{"class":503},[100,864,474],{"class":113},[100,866,867],{"class":524}," var",[100,869,121],{"class":113},[100,871,504],{"class":503},[100,873,874],{"class":124},"Vue",[100,876,510],{"class":503},[100,878,474],{"class":113},[100,880,881],{"class":524}," path",[100,883,121],{"class":113},[100,885,504],{"class":503},[100,887,888],{"class":124},"https:\u002F\u002Funpkg.com\u002Fvue@3\u002Fdist\u002Fvue.global.js",[100,890,510],{"class":503},[100,892,893],{"class":113}," },\n",[100,895,896,898,900,902,904,906,908,910,912,914,916,918,920,922,924,926,928,931,933],{"class":102,"line":189},[100,897,852],{"class":113},[100,899,118],{"class":524},[100,901,121],{"class":113},[100,903,504],{"class":503},[100,905,758],{"class":124},[100,907,510],{"class":503},[100,909,474],{"class":113},[100,911,867],{"class":524},[100,913,121],{"class":113},[100,915,504],{"class":503},[100,917,758],{"class":124},[100,919,510],{"class":503},[100,921,474],{"class":113},[100,923,881],{"class":524},[100,925,121],{"class":113},[100,927,504],{"class":503},[100,929,930],{"class":124},"https:\u002F\u002Funpkg.com\u002Faxios\u002Fdist\u002Faxios.min.js",[100,932,510],{"class":503},[100,934,893],{"class":113},[100,936,937,940],{"class":102,"line":198},[100,938,939],{"class":256},"      ]",[100,941,552],{"class":113},[100,943,944,947,949],{"class":102,"line":205},[100,945,946],{"class":113},"    }",[100,948,600],{"class":256},[100,950,552],{"class":113},[100,952,953,956],{"class":102,"line":215},[100,954,955],{"class":256},"  ]",[100,957,552],{"class":113},[100,959,961],{"class":102,"line":960},13,[100,962,622],{"class":113},[23,964,965,966,969],{},"注意：需要确保 CDN 资源可用，并在 ",[51,967,968],{},"rollupOptions.external"," 中声明外部依赖。",[46,971,973,974,977],{"id":972},"_2-构建后通过插件如-vite-plugin-s3上传静态文件","2. 构建后通过插件（如 ",[51,975,976],{},"vite-plugin-s3","）上传静态文件",[23,979,980,981,984],{},"将 ",[51,982,983],{},"dist"," 目录中的资源自动上传到云存储（如 AWS S3、OSS）可搭配插件完成。",[91,986,988],{"className":319,"code":987,"language":321,"meta":96,"style":96},"import s3Plugin from \"vite-plugin-s3\";\n\nexport default {\n  plugins: [\n    s3Plugin({\n      bucket: \"my-bucket\",\n      region: \"us-east-1\",\n      acl: \"public-read\",\n      basePath: \"\u002Fstatic\",\n    }),\n  ],\n};\n",[51,989,990,1007,1011,1019,1027,1036,1052,1068,1084,1100,1108,1114],{"__ignoreMap":96},[100,991,992,994,997,999,1001,1003,1005],{"class":102,"line":103},[100,993,769],{"class":416},[100,995,996],{"class":256}," s3Plugin ",[100,998,799],{"class":416},[100,1000,504],{"class":503},[100,1002,976],{"class":124},[100,1004,510],{"class":503},[100,1006,347],{"class":113},[100,1008,1009],{"class":102,"line":110},[100,1010,174],{"emptyLinePlaceholder":173},[100,1012,1013,1015,1017],{"class":102,"line":128},[100,1014,253],{"class":416},[100,1016,464],{"class":416},[100,1018,333],{"class":113},[100,1020,1021,1023,1025],{"class":102,"line":139},[100,1022,824],{"class":524},[100,1024,121],{"class":113},[100,1026,829],{"class":256},[100,1028,1029,1032,1034],{"class":102,"line":148},[100,1030,1031],{"class":576},"    s3Plugin",[100,1033,580],{"class":256},[100,1035,635],{"class":113},[100,1037,1038,1041,1043,1045,1048,1050],{"class":102,"line":159},[100,1039,1040],{"class":524},"      bucket",[100,1042,121],{"class":113},[100,1044,504],{"class":503},[100,1046,1047],{"class":124},"my-bucket",[100,1049,510],{"class":503},[100,1051,552],{"class":113},[100,1053,1054,1057,1059,1061,1064,1066],{"class":102,"line":170},[100,1055,1056],{"class":524},"      region",[100,1058,121],{"class":113},[100,1060,504],{"class":503},[100,1062,1063],{"class":124},"us-east-1",[100,1065,510],{"class":503},[100,1067,552],{"class":113},[100,1069,1070,1073,1075,1077,1080,1082],{"class":102,"line":177},[100,1071,1072],{"class":524},"      acl",[100,1074,121],{"class":113},[100,1076,504],{"class":503},[100,1078,1079],{"class":124},"public-read",[100,1081,510],{"class":503},[100,1083,552],{"class":113},[100,1085,1086,1089,1091,1093,1096,1098],{"class":102,"line":189},[100,1087,1088],{"class":524},"      basePath",[100,1090,121],{"class":113},[100,1092,504],{"class":503},[100,1094,1095],{"class":124},"\u002Fstatic",[100,1097,510],{"class":503},[100,1099,552],{"class":113},[100,1101,1102,1104,1106],{"class":102,"line":198},[100,1103,946],{"class":113},[100,1105,600],{"class":256},[100,1107,552],{"class":113},[100,1109,1110,1112],{"class":102,"line":205},[100,1111,955],{"class":256},[100,1113,552],{"class":113},[100,1115,1116],{"class":102,"line":215},[100,1117,622],{"class":113},[23,1119,1120,1121,1124],{},"也可以编写自定义插件，在 ",[51,1122,1123],{},"writeBundle"," 钩子中实现上传逻辑。",[38,1126,1128],{"id":1127},"四legacy-浏览器支持","四、Legacy 浏览器支持",[23,1130,1131,1132,1135],{},"通过 ",[51,1133,1134],{},"@vitejs\u002Fplugin-legacy"," 可以支持较旧的浏览器（如 IE 11 或旧版 Chrome\u002FFirefox），同时不为现代浏览器加载多余 polyfill。",[46,1137,741,1139,1141],{"id":1138},"_1-使用-vitejsplugin-legacy-生成传统-chunk-和-polyfill",[51,1140,1134],{}," 生成传统 chunk 和 polyfill",[23,1143,1144,1145,1148],{},"该插件会根据 ",[51,1146,1147],{},"browserslist"," 配置生成现代 + legacy 两套产物，并根据用户代理动态加载。",[91,1150,1152],{"className":243,"code":1151,"language":245,"meta":96,"style":96},"npm install -D @vitejs\u002Fplugin-legacy terser\n",[51,1153,1154],{"__ignoreMap":96},[100,1155,1156,1158,1161,1164,1167],{"class":102,"line":103},[100,1157,270],{"class":269},[100,1159,1160],{"class":124}," install",[100,1162,1163],{"class":312}," -D",[100,1165,1166],{"class":124}," @vitejs\u002Fplugin-legacy",[100,1168,1169],{"class":124}," terser\n",[91,1171,1173],{"className":319,"code":1172,"language":321,"meta":96,"style":96},"\u002F\u002F vite.config.js\nimport legacy from \"@vitejs\u002Fplugin-legacy\";\n\nexport default {\n  plugins: [\n    legacy({\n      targets: [\"defaults\", \"not IE 11\"], \u002F\u002F 或使用 browserslist\n      additionalLegacyPolyfills: [\"regenerator-runtime\u002Fruntime\"],\n      modernPolyfills: true,\n    }),\n  ],\n};\n",[51,1174,1175,1180,1197,1201,1209,1217,1226,1260,1280,1291,1299,1305],{"__ignoreMap":96},[100,1176,1177],{"class":102,"line":103},[100,1178,1179],{"class":106},"\u002F\u002F vite.config.js\n",[100,1181,1182,1184,1187,1189,1191,1193,1195],{"class":102,"line":110},[100,1183,769],{"class":416},[100,1185,1186],{"class":256}," legacy ",[100,1188,799],{"class":416},[100,1190,504],{"class":503},[100,1192,1134],{"class":124},[100,1194,510],{"class":503},[100,1196,347],{"class":113},[100,1198,1199],{"class":102,"line":128},[100,1200,174],{"emptyLinePlaceholder":173},[100,1202,1203,1205,1207],{"class":102,"line":139},[100,1204,253],{"class":416},[100,1206,464],{"class":416},[100,1208,333],{"class":113},[100,1210,1211,1213,1215],{"class":102,"line":148},[100,1212,824],{"class":524},[100,1214,121],{"class":113},[100,1216,829],{"class":256},[100,1218,1219,1222,1224],{"class":102,"line":159},[100,1220,1221],{"class":576},"    legacy",[100,1223,580],{"class":256},[100,1225,635],{"class":113},[100,1227,1228,1231,1233,1236,1238,1241,1243,1245,1247,1250,1252,1255,1257],{"class":102,"line":170},[100,1229,1230],{"class":524},"      targets",[100,1232,121],{"class":113},[100,1234,1235],{"class":256}," [",[100,1237,510],{"class":503},[100,1239,1240],{"class":124},"defaults",[100,1242,510],{"class":503},[100,1244,474],{"class":113},[100,1246,504],{"class":503},[100,1248,1249],{"class":124},"not IE 11",[100,1251,510],{"class":503},[100,1253,1254],{"class":256},"]",[100,1256,474],{"class":113},[100,1258,1259],{"class":106}," \u002F\u002F 或使用 browserslist\n",[100,1261,1262,1265,1267,1269,1271,1274,1276,1278],{"class":102,"line":177},[100,1263,1264],{"class":524},"      additionalLegacyPolyfills",[100,1266,121],{"class":113},[100,1268,1235],{"class":256},[100,1270,510],{"class":503},[100,1272,1273],{"class":124},"regenerator-runtime\u002Fruntime",[100,1275,510],{"class":503},[100,1277,1254],{"class":256},[100,1279,552],{"class":113},[100,1281,1282,1285,1287,1289],{"class":102,"line":189},[100,1283,1284],{"class":524},"      modernPolyfills",[100,1286,121],{"class":113},[100,1288,344],{"class":343},[100,1290,552],{"class":113},[100,1292,1293,1295,1297],{"class":102,"line":198},[100,1294,946],{"class":113},[100,1296,600],{"class":256},[100,1298,552],{"class":113},[100,1300,1301,1303],{"class":102,"line":205},[100,1302,955],{"class":256},[100,1304,552],{"class":113},[100,1306,1307],{"class":102,"line":215},[100,1308,622],{"class":113},[46,1310,1312,1313,1315],{"id":1311},"_2-使用-browserslist-指定目标","2. 使用 ",[51,1314,1147],{}," 指定目标",[23,1317,1318,1319,1322,1323,1325,1326,1329],{},"在 ",[51,1320,1321],{},"package.json"," 中添加 ",[51,1324,1147],{}," 字段或单独的 ",[51,1327,1328],{},".browserslistrc"," 文件。",[91,1331,1335],{"className":1332,"code":1333,"language":1334,"meta":96,"style":96},"language-json shiki shiki-themes material-theme-lighter github-light github-dark","\"browserslist\": [\n  \"> 0.5%\",\n  \"last 2 versions\",\n  \"not dead\",\n  \"not ie 11\"\n]\n","json",[51,1336,1337,1351,1363,1374,1385,1395],{"__ignoreMap":96},[100,1338,1339,1341,1343,1345,1348],{"class":102,"line":103},[100,1340,510],{"class":503},[100,1342,1147],{"class":124},[100,1344,510],{"class":503},[100,1346,1347],{"class":256},": ",[100,1349,1350],{"class":113},"[\n",[100,1352,1353,1356,1359,1361],{"class":102,"line":110},[100,1354,1355],{"class":503},"  \"",[100,1357,1358],{"class":124},"> 0.5%",[100,1360,510],{"class":503},[100,1362,552],{"class":113},[100,1364,1365,1367,1370,1372],{"class":102,"line":128},[100,1366,1355],{"class":503},[100,1368,1369],{"class":124},"last 2 versions",[100,1371,510],{"class":503},[100,1373,552],{"class":113},[100,1375,1376,1378,1381,1383],{"class":102,"line":139},[100,1377,1355],{"class":503},[100,1379,1380],{"class":124},"not dead",[100,1382,510],{"class":503},[100,1384,552],{"class":113},[100,1386,1387,1389,1392],{"class":102,"line":148},[100,1388,1355],{"class":503},[100,1390,1391],{"class":124},"not ie 11",[100,1393,1394],{"class":503},"\"\n",[100,1396,1397],{"class":102,"line":159},[100,1398,1399],{"class":113},"]\n",[46,1401,1403],{"id":1402},"_3-动态加载-legacy-产物保证现代浏览器性能不收损","3. 动态加载 legacy 产物，保证现代浏览器性能不收损",[23,1405,1406,1408],{},[51,1407,1134],{}," 会在 HTML 中插入类似以下代码：",[60,1410,1411,1417],{},[63,1412,1131,1413,1416],{},[51,1414,1415],{},"\u003Cscript type=\"module\">"," 加载现代 build。",[63,1418,1131,1419,1422],{},[51,1420,1421],{},"\u003Cscript nomodule>"," 加载 legacy polyfill 和传统 build（仅在不支持 module 的浏览器执行）。",[23,1424,1425],{},"现代浏览器只加载现代 bundle，性能不受影响。",[38,1427,1429],{"id":1428},"五性能预算监控","五、性能预算监控",[23,1431,1432],{},"持续监控产物体积，防止退化。",[46,1434,1436,1437,1440],{"id":1435},"_1-集成-bundlesize-或自定义-ci-脚本","1. 集成 ",[51,1438,1439],{},"bundlesize"," 或自定义 CI 脚本",[23,1442,1443,1447],{},[66,1444,377,1445],{},[51,1446,1439],{},"（适用于任何构建工具）：",[23,1449,1450,1451,1453,1454,1456],{},"全局安装 ",[51,1452,1439],{}," 并在 ",[51,1455,1321],{}," 中配置：",[91,1458,1460],{"className":1332,"code":1459,"language":1334,"meta":96,"style":96},"{\n  \"bundlesize\": [\n    {\n      \"path\": \".\u002Fdist\u002Fassets\u002F*.js\",\n      \"maxSize\": \"200 kB\",\n      \"compression\": \"gzip\"\n    },\n    {\n      \"path\": \".\u002Fdist\u002Fassets\u002F*.css\",\n      \"maxSize\": \"50 kB\"\n    }\n  ]\n}\n",[51,1461,1462,1466,1480,1485,1507,1527,1545,1549,1553,1572,1589,1593,1598],{"__ignoreMap":96},[100,1463,1464],{"class":102,"line":103},[100,1465,635],{"class":113},[100,1467,1468,1471,1474,1476,1478],{"class":102,"line":110},[100,1469,1355],{"class":1470},"s39Yj",[100,1472,1439],{"class":1473},"sseR_",[100,1475,510],{"class":1470},[100,1477,121],{"class":113},[100,1479,829],{"class":113},[100,1481,1482],{"class":102,"line":128},[100,1483,1484],{"class":113},"    {\n",[100,1486,1487,1490,1494,1496,1498,1500,1503,1505],{"class":102,"line":139},[100,1488,1489],{"class":1470},"      \"",[100,1491,1493],{"class":1492},"sZMiF","path",[100,1495,510],{"class":1470},[100,1497,121],{"class":113},[100,1499,504],{"class":503},[100,1501,1502],{"class":124},".\u002Fdist\u002Fassets\u002F*.js",[100,1504,510],{"class":503},[100,1506,552],{"class":113},[100,1508,1509,1511,1514,1516,1518,1520,1523,1525],{"class":102,"line":148},[100,1510,1489],{"class":1470},[100,1512,1513],{"class":1492},"maxSize",[100,1515,510],{"class":1470},[100,1517,121],{"class":113},[100,1519,504],{"class":503},[100,1521,1522],{"class":124},"200 kB",[100,1524,510],{"class":503},[100,1526,552],{"class":113},[100,1528,1529,1531,1534,1536,1538,1540,1543],{"class":102,"line":159},[100,1530,1489],{"class":1470},[100,1532,1533],{"class":1492},"compression",[100,1535,510],{"class":1470},[100,1537,121],{"class":113},[100,1539,504],{"class":503},[100,1541,1542],{"class":124},"gzip",[100,1544,1394],{"class":503},[100,1546,1547],{"class":102,"line":170},[100,1548,607],{"class":113},[100,1550,1551],{"class":102,"line":177},[100,1552,1484],{"class":113},[100,1554,1555,1557,1559,1561,1563,1565,1568,1570],{"class":102,"line":189},[100,1556,1489],{"class":1470},[100,1558,1493],{"class":1492},[100,1560,510],{"class":1470},[100,1562,121],{"class":113},[100,1564,504],{"class":503},[100,1566,1567],{"class":124},".\u002Fdist\u002Fassets\u002F*.css",[100,1569,510],{"class":503},[100,1571,552],{"class":113},[100,1573,1574,1576,1578,1580,1582,1584,1587],{"class":102,"line":198},[100,1575,1489],{"class":1470},[100,1577,1513],{"class":1492},[100,1579,510],{"class":1470},[100,1581,121],{"class":113},[100,1583,504],{"class":503},[100,1585,1586],{"class":124},"50 kB",[100,1588,1394],{"class":503},[100,1590,1591],{"class":102,"line":205},[100,1592,724],{"class":113},[100,1594,1595],{"class":102,"line":215},[100,1596,1597],{"class":113},"  ]\n",[100,1599,1600],{"class":102,"line":960},[100,1601,352],{"class":113},[23,1603,1604],{},"在 CI 中运行：",[91,1606,1608],{"className":243,"code":1607,"language":245,"meta":96,"style":96},"npx bundlesize\n",[51,1609,1610],{"__ignoreMap":96},[100,1611,1612,1615],{"class":102,"line":103},[100,1613,1614],{"class":269},"npx",[100,1616,1617],{"class":124}," bundlesize\n",[23,1619,1620,1623,1624,1627,1628,1631],{},[66,1621,1622],{},"自定义 CI 脚本","：\n使用 ",[51,1625,1626],{},"vite build --report","（通过 ",[51,1629,1630],{},"rollup-plugin-visualizer","）生成体积报告，然后用 Node 脚本读取并比较阈值。",[91,1633,1635],{"className":319,"code":1634,"language":321,"meta":96,"style":96},"\u002F\u002F scripts\u002Fcheck-size.js\nconst fs = require(\"fs\");\nconst path = require(\"path\");\nconst files = fs.readdirSync(\"dist\u002Fassets\");\nlet totalSize = 0;\nfiles.forEach((file) => {\n  if (file.endsWith(\".js\")) {\n    totalSize += fs.statSync(path.join(\"dist\u002Fassets\", file)).size;\n  }\n});\nif (totalSize > 500 * 1024) {\n  console.error(`Bundle size exceeded: ${totalSize} bytes`);\n  process.exit(1);\n}\n",[51,1636,1637,1642,1667,1689,1718,1734,1757,1785,1832,1836,1845,1869,1904,1923],{"__ignoreMap":96},[100,1638,1639],{"class":102,"line":103},[100,1640,1641],{"class":106},"\u002F\u002F scripts\u002Fcheck-size.js\n",[100,1643,1644,1646,1649,1651,1654,1656,1658,1661,1663,1665],{"class":102,"line":110},[100,1645,406],{"class":252},[100,1647,1648],{"class":409}," fs",[100,1650,413],{"class":260},[100,1652,1653],{"class":576}," require",[100,1655,580],{"class":256},[100,1657,510],{"class":503},[100,1659,1660],{"class":124},"fs",[100,1662,510],{"class":503},[100,1664,600],{"class":256},[100,1666,347],{"class":113},[100,1668,1669,1671,1673,1675,1677,1679,1681,1683,1685,1687],{"class":102,"line":128},[100,1670,406],{"class":252},[100,1672,881],{"class":409},[100,1674,413],{"class":260},[100,1676,1653],{"class":576},[100,1678,580],{"class":256},[100,1680,510],{"class":503},[100,1682,1493],{"class":124},[100,1684,510],{"class":503},[100,1686,600],{"class":256},[100,1688,347],{"class":113},[100,1690,1691,1693,1696,1698,1700,1702,1705,1707,1709,1712,1714,1716],{"class":102,"line":139},[100,1692,406],{"class":252},[100,1694,1695],{"class":409}," files",[100,1697,413],{"class":260},[100,1699,1648],{"class":256},[100,1701,420],{"class":113},[100,1703,1704],{"class":576},"readdirSync",[100,1706,580],{"class":256},[100,1708,510],{"class":503},[100,1710,1711],{"class":124},"dist\u002Fassets",[100,1713,510],{"class":503},[100,1715,600],{"class":256},[100,1717,347],{"class":113},[100,1719,1720,1723,1726,1728,1732],{"class":102,"line":148},[100,1721,1722],{"class":252},"let",[100,1724,1725],{"class":256}," totalSize ",[100,1727,261],{"class":260},[100,1729,1731],{"class":1730},"srdBf"," 0",[100,1733,347],{"class":113},[100,1735,1736,1739,1741,1744,1746,1748,1751,1753,1755],{"class":102,"line":159},[100,1737,1738],{"class":256},"files",[100,1740,420],{"class":113},[100,1742,1743],{"class":576},"forEach",[100,1745,580],{"class":256},[100,1747,580],{"class":113},[100,1749,1750],{"class":470},"file",[100,1752,600],{"class":113},[100,1754,483],{"class":252},[100,1756,333],{"class":113},[100,1758,1759,1762,1764,1766,1768,1771,1773,1775,1778,1780,1783],{"class":102,"line":170},[100,1760,1761],{"class":416},"  if",[100,1763,680],{"class":524},[100,1765,1750],{"class":256},[100,1767,420],{"class":113},[100,1769,1770],{"class":576},"endsWith",[100,1772,580],{"class":524},[100,1774,510],{"class":503},[100,1776,1777],{"class":124},".js",[100,1779,510],{"class":503},[100,1781,1782],{"class":524},")) ",[100,1784,635],{"class":113},[100,1786,1787,1790,1793,1795,1797,1800,1802,1804,1806,1809,1811,1813,1815,1817,1819,1822,1825,1827,1830],{"class":102,"line":177},[100,1788,1789],{"class":256},"    totalSize",[100,1791,1792],{"class":260}," +=",[100,1794,1648],{"class":256},[100,1796,420],{"class":113},[100,1798,1799],{"class":576},"statSync",[100,1801,580],{"class":524},[100,1803,1493],{"class":256},[100,1805,420],{"class":113},[100,1807,1808],{"class":576},"join",[100,1810,580],{"class":524},[100,1812,510],{"class":503},[100,1814,1711],{"class":124},[100,1816,510],{"class":503},[100,1818,474],{"class":113},[100,1820,1821],{"class":256}," file",[100,1823,1824],{"class":524},"))",[100,1826,420],{"class":113},[100,1828,1829],{"class":256},"size",[100,1831,347],{"class":113},[100,1833,1834],{"class":102,"line":189},[100,1835,729],{"class":113},[100,1837,1838,1841,1843],{"class":102,"line":198},[100,1839,1840],{"class":113},"}",[100,1842,600],{"class":256},[100,1844,347],{"class":113},[100,1846,1847,1850,1853,1856,1859,1862,1865,1867],{"class":102,"line":205},[100,1848,1849],{"class":416},"if",[100,1851,1852],{"class":256}," (totalSize ",[100,1854,1855],{"class":260},">",[100,1857,1858],{"class":1730}," 500",[100,1860,1861],{"class":260}," *",[100,1863,1864],{"class":1730}," 1024",[100,1866,670],{"class":256},[100,1868,635],{"class":113},[100,1870,1871,1874,1876,1879,1881,1884,1887,1890,1893,1895,1898,1900,1902],{"class":102,"line":215},[100,1872,1873],{"class":256},"  console",[100,1875,420],{"class":113},[100,1877,1878],{"class":576},"error",[100,1880,580],{"class":524},[100,1882,1883],{"class":503},"`",[100,1885,1886],{"class":124},"Bundle size exceeded: ",[100,1888,1889],{"class":503},"${",[100,1891,1892],{"class":256},"totalSize",[100,1894,1840],{"class":503},[100,1896,1897],{"class":124}," bytes",[100,1899,1883],{"class":503},[100,1901,600],{"class":524},[100,1903,347],{"class":113},[100,1905,1906,1909,1911,1914,1916,1919,1921],{"class":102,"line":960},[100,1907,1908],{"class":256},"  process",[100,1910,420],{"class":113},[100,1912,1913],{"class":576},"exit",[100,1915,580],{"class":524},[100,1917,1918],{"class":1730},"1",[100,1920,600],{"class":524},[100,1922,347],{"class":113},[100,1924,1926],{"class":102,"line":1925},14,[100,1927,352],{"class":113},[46,1929,1931],{"id":1930},"_2-在-ci-中集成体积检查","2. 在 CI 中集成体积检查",[60,1933,1934,1944],{},[63,1935,1936,1939,1940,1943],{},[66,1937,1938],{},"GitHub Actions","：使用 ",[51,1941,1942],{},"actions\u002Fupload-artifact"," 保存体积报告，或直接运行检查脚本。",[63,1945,1946,1949,1950,1953],{},[66,1947,1948],{},"GitLab CI","：在 ",[51,1951,1952],{},"after_script"," 中执行大小检查，并将报告作为 artifacts。",[23,1955,1956,1959],{},[66,1957,1958],{},"示例 GitHub Action","：",[91,1961,1963],{"className":93,"code":1962,"language":95,"meta":96,"style":96},"- name: Build\n  run: npm run build\n\n- name: Check bundle size\n  run: node scripts\u002Fcheck-size.js\n",[51,1964,1965,1976,1986,1990,2001],{"__ignoreMap":96},[100,1966,1967,1969,1971,1973],{"class":102,"line":103},[100,1968,114],{"class":113},[100,1970,118],{"class":117},[100,1972,121],{"class":113},[100,1974,1975],{"class":124}," Build\n",[100,1977,1978,1981,1983],{"class":102,"line":110},[100,1979,1980],{"class":117},"  run",[100,1982,121],{"class":113},[100,1984,1985],{"class":124}," npm run build\n",[100,1987,1988],{"class":102,"line":128},[100,1989,174],{"emptyLinePlaceholder":173},[100,1991,1992,1994,1996,1998],{"class":102,"line":139},[100,1993,114],{"class":113},[100,1995,118],{"class":117},[100,1997,121],{"class":113},[100,1999,2000],{"class":124}," Check bundle size\n",[100,2002,2003,2005,2007],{"class":102,"line":148},[100,2004,1980],{"class":117},[100,2006,121],{"class":113},[100,2008,2009],{"class":124}," node scripts\u002Fcheck-size.js\n",[2011,2012,2013],"h2",{"id":2013},"总结",[2015,2016,2017,2030],"table",{},[2018,2019,2020],"thead",{},[2021,2022,2023,2027],"tr",{},[2024,2025,2026],"th",{},"实践方向",[2024,2028,2029],{},"核心措施",[2031,2032,2033,2052,2069,2081,2096],"tbody",{},[2021,2034,2035,2041],{},[2036,2037,2038],"td",{},[66,2039,2040],{},"CI\u002FCD 优化",[2036,2042,2043,2044,54,2046,2048,2049,2051],{},"缓存 ",[51,2045,53],{},[51,2047,57],{},"；设置 ",[51,2050,233],{},"；控制输出目录清理",[2021,2053,2054,2059],{},[2036,2055,2056],{},[66,2057,2058],{},"多环境配置",[2036,2060,377,2061,54,2063,2065,2066,2068],{},[51,2062,380],{},[51,2064,373],{},"；",[51,2067,441],{}," 钩子动态调整配置",[2021,2070,2071,2076],{},[2036,2072,2073],{},[66,2074,2075],{},"CDN 与上传",[2036,2077,2078,2080],{},[51,2079,744],{}," 替换依赖；插件自动上传产物至云存储",[2021,2082,2083,2088],{},[2036,2084,2085],{},[66,2086,2087],{},"Legacy 支持",[2036,2089,2090,2092,2093,2095],{},[51,2091,1134],{}," + ",[51,2094,1147],{},"；动态加载策略",[2021,2097,2098,2103],{},[2036,2099,2100],{},[66,2101,2102],{},"性能预算监控",[2036,2104,2105,2107],{},[51,2106,1439],{}," 或自定义脚本；CI 中集成体积检查并设置告警阈值",[23,2109,2110],{},"将这些实践纳入工程流程，可显著提升构建效率、产物质量及浏览器兼容性，同时长期保障应用性能不超标。",[2011,2112,2113],{"id":2113},"参考文献",[23,2115,2116],{},"以下链接在编写时均可正常访问：",[2015,2118,2119,2129],{},[2018,2120,2121],{},[2021,2122,2123,2126],{},[2024,2124,2125],{},"资料",[2024,2127,2128],{},"说明",[2031,2130,2131,2144,2155],{},[2021,2132,2133,2141],{},[2036,2134,2135],{},[27,2136,2140],{"href":2137,"rel":2138},"https:\u002F\u002Fcn.vite.dev\u002Fguide\u002Fstatic-deploy",[2139],"nofollow","Vite：部署静态站点",[2036,2142,2143],{},"官方",[2021,2145,2146,2152],{},[2036,2147,2148],{},[27,2149,1134],{"href":2150,"rel":2151},"https:\u002F\u002Fgithub.com\u002Fvitejs\u002Fvite\u002Ftree\u002Fmain\u002Fpackages\u002Fplugin-legacy",[2139],[2036,2153,2154],{},"旧浏览器",[2021,2156,2157,2164],{},[2036,2158,2159],{},[27,2160,2163],{"href":2161,"rel":2162},"https:\u002F\u002Fdocs.github.com\u002Fen\u002Factions\u002Fusing-workflows\u002Fcaching-dependencies-to-speed-up-workflows",[2139],"GitHub Actions 缓存",[2036,2165,2166],{},"CI 缓存",[2168,2169,2170],"style",{},"html pre.shiki code .sutJx, html code.shiki .sutJx{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit}html pre.shiki code .sP7_E, html code.shiki .sP7_E{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sQzsp, html code.shiki .sQzsp{--shiki-light:#E53935;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .su5hD, html code.shiki .su5hD{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .smGrS, html code.shiki .smGrS{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sbgvK, html code.shiki .sbgvK{--shiki-light:#E2931D;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .stzsN, html code.shiki .stzsN{--shiki-light:#91B859;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .syTEX, html code.shiki .syTEX{--shiki-light:#FF5370;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .s_hVV, html code.shiki .s_hVV{--shiki-light:#90A4AE;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sVHd0, html code.shiki .sVHd0{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .s99_P, html code.shiki .s99_P{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#E36209;--shiki-default-font-style:inherit;--shiki-dark:#FFAB70;--shiki-dark-font-style:inherit}html pre.shiki code .sjJ54, html code.shiki .sjJ54{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .skxfh, html code.shiki .skxfh{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .s39Yj, html code.shiki .s39Yj{--shiki-light:#39ADB5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sseR_, html code.shiki .sseR_{--shiki-light:#9C3EDA;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sZMiF, html code.shiki .sZMiF{--shiki-light:#E2931D;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .srdBf, html code.shiki .srdBf{--shiki-light:#F76D47;--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":96,"searchDepth":110,"depth":110,"links":2172},[2173,2174,2175,2176,2177,2178,2179],{"id":40,"depth":128,"text":41},{"id":355,"depth":128,"text":356},{"id":736,"depth":128,"text":737},{"id":1127,"depth":128,"text":1128},{"id":1428,"depth":128,"text":1429},{"id":2013,"depth":110,"text":2013},{"id":2113,"depth":110,"text":2113},{"title":8,"description":9},"knowledge\u002Fbooklet\u002Fproject\u002FVite\u002Fdeploy","knowledge\u002Fknowledge\u002Fbooklet\u002Fproject\u002FVite\u002Fdeploy.md","md",{"items":2185},[2186,2190,2194,2196,2200,2204],{"path":2187,"title":2188,"description":2189,"category":10,"score":159},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fplugin","插件开发","Vite 插件兼容 Rollup 插件，并扩展 config、configureServer、transformIndexHtml 等钩子。原理见 工作原理。",{"path":2191,"title":2192,"description":2193,"category":10,"score":159},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fadvanced","进阶配置","Vite 进阶：server.proxy、resolve.alias、SSR、多页面、库模式、vite preview 等。环境变量见 env。",{"path":34,"title":35,"description":2195,"category":10,"score":159},"vite build 使用 Rollup 打包并应用内置优化。开发阶段原理见 工作原理。",{"path":2197,"title":2198,"description":2199,"category":10,"score":159},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fcreate-vite","create-vite","pnpm create vite 实际执行的是 npm 包 create-vite（与 vite 本体不同）。工程化背景见 工程化概览、工作原理。",{"path":2201,"title":2202,"description":2203,"category":10,"score":159},"\u002Fknowledge\u002Fbooklet\u002Fproject\u002Fvite\u002Fworkflow","工作原理","Vite 是面向现代浏览器的前端构建工具：开发阶段利用原生 ES 模块与按需编译；生产构建由 Rollup 完成。对比见 Webpack 与 Vite、工程化概览。",{"path":2205,"title":2206,"description":2207,"category":10,"score":139},"\u002Fknowledge\u002Fbooklet\u002Fend\u002Fbun\u002Fdeploy","生产环境与部署指南","Bun 内置了高性能的打包器（bundler），可以对前端或全栈应用进行生产优化。",{"series":2209,"title":12,"items":2210,"index":128,"prev":2222,"next":2223},"booklet\u002Fproject\u002Fvite",[2211,2213,2215,2217,2218,2220],{"path":2191,"title":2192,"date":2212,"pinned":15},"2022-05-08",{"path":34,"title":35,"date":2214,"pinned":15},"2021-07-24",{"path":2197,"title":2198,"date":2216,"pinned":15},"2021-03-05",{"path":7,"title":8,"date":14,"pinned":15},{"path":2187,"title":2188,"date":2219,"pinned":15},"2023-03-27",{"path":2201,"title":2202,"date":2221,"pinned":15},"2020-06-15",{"path":2197,"title":2198,"date":2216,"pinned":15},{"path":2187,"title":2188,"date":2219,"pinned":15}]