[{"data":1,"prerenderedAt":1284},["ShallowReactive",2],{"content-query-cz2ohRx7fw":3},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"date":10,"url":11,"tags":12,"en-title":17,"body":18,"_type":1278,"_id":1279,"_source":1280,"_file":1281,"_stem":1282,"_extension":1283},"/blog/2026-06-04-nuxt-generate-google-fonts","blog",false,"","解决 Nuxt generate 时 Google Fonts 拉取失败","摘要：在 Nuxt 静态生成过程中，如果 UnoCSS 的 Web Fonts 预设需要从 Google Fonts 下载字体 CSS，离线环境、国内网络或 CI DNS 异常都可能触发 Failed to fetch web fonts。本文记录问题现象、原因定位和几种可落地的解决方案。","2026-06-04 12:00:00",null,[13,14,15,16],"Nuxt","UnoCSS","code","构建","Fix Google Fonts Fetch Failure in Nuxt Generate",{"type":19,"children":20,"toc":1269},"root",[21,29,43,47,53,58,91,96,130,143,148,153,179,192,205,353,358,364,385,390,429,434,601,606,612,617,636,788,793,830,835,841,846,1126,1131,1168,1173,1178,1183,1204,1209,1237,1242,1247,1258,1263],{"type":22,"tag":23,"props":24,"children":26},"element","h1",{"id":25},"解决-nuxt-generate-时-google-fonts-拉取失败",[27],{"type":28,"value":8},"text",{"type":22,"tag":30,"props":31,"children":32},"p",{},[33,35,41],{"type":28,"value":34},"摘要：在 Nuxt 静态生成过程中，如果 UnoCSS 的 Web Fonts 预设需要从 Google Fonts 下载字体 CSS，离线环境、国内网络或 CI DNS 异常都可能触发 ",{"type":22,"tag":15,"props":36,"children":38},{"className":37},[],[39],{"type":28,"value":40},"Failed to fetch web fonts",{"type":28,"value":42},"。本文记录问题现象、原因定位和几种可落地的解决方案。",{"type":22,"tag":44,"props":45,"children":46},"hr",{},[],{"type":22,"tag":48,"props":49,"children":51},"h2",{"id":50},"问题现象",[52],{"type":28,"value":50},{"type":22,"tag":30,"props":54,"children":55},{},[56],{"type":28,"value":57},"执行静态生成命令：",{"type":22,"tag":59,"props":60,"children":64},"pre",{"className":61,"code":62,"language":63,"meta":7,"style":7},"language-bash shiki shiki-themes vitesse-light vitesse-dark monokai","pnpm run generate\n","bash",[65],{"type":22,"tag":15,"props":66,"children":67},{"__ignoreMap":7},[68],{"type":22,"tag":69,"props":70,"children":73},"span",{"class":71,"line":72},"line",1,[74,80,86],{"type":22,"tag":69,"props":75,"children":77},{"style":76},"--shiki-default:#59873A;--shiki-dark:#80A665;--shiki-sepia:#A6E22E",[78],{"type":28,"value":79},"pnpm",{"type":22,"tag":69,"props":81,"children":83},{"style":82},"--shiki-default:#B56959;--shiki-dark:#C98A7D;--shiki-sepia:#E6DB74",[84],{"type":28,"value":85}," run",{"type":22,"tag":69,"props":87,"children":88},{"style":82},[89],{"type":28,"value":90}," generate\n",{"type":22,"tag":30,"props":92,"children":93},{},[94],{"type":28,"value":95},"构建过程中出现类似提示：",{"type":22,"tag":59,"props":97,"children":100},{"className":98,"code":99,"language":28,"meta":7,"style":7},"language-text shiki shiki-themes vitesse-light vitesse-dark monokai","Failed to fetch web fonts\nFetchError: [GET] \"https://fonts.googleapis.com/css2?family=Inter&family=Noto+Sans+Simplified+Chinese&display=swap\": \u003Cno response> fetch failed\ngetaddrinfo ENOTFOUND fonts.googleapis.com\n",[101],{"type":22,"tag":15,"props":102,"children":103},{"__ignoreMap":7},[104,112,121],{"type":22,"tag":69,"props":105,"children":106},{"class":71,"line":72},[107],{"type":22,"tag":69,"props":108,"children":109},{},[110],{"type":28,"value":111},"Failed to fetch web fonts\n",{"type":22,"tag":69,"props":113,"children":115},{"class":71,"line":114},2,[116],{"type":22,"tag":69,"props":117,"children":118},{},[119],{"type":28,"value":120},"FetchError: [GET] \"https://fonts.googleapis.com/css2?family=Inter&family=Noto+Sans+Simplified+Chinese&display=swap\": \u003Cno response> fetch failed\n",{"type":22,"tag":69,"props":122,"children":124},{"class":71,"line":123},3,[125],{"type":22,"tag":69,"props":126,"children":127},{},[128],{"type":28,"value":129},"getaddrinfo ENOTFOUND fonts.googleapis.com\n",{"type":22,"tag":30,"props":131,"children":132},{},[133,135,141],{"type":28,"value":134},"如果项目配置了静态托管，Nuxt 最后可能仍然生成 ",{"type":22,"tag":15,"props":136,"children":138},{"className":137},[],[139],{"type":28,"value":140},".output/public",{"type":28,"value":142},"，但这类错误会让 CI 日志变得不稳定，也会导致字体样式无法按预期内联。",{"type":22,"tag":48,"props":144,"children":146},{"id":145},"为什么会发生",[147],{"type":28,"value":145},{"type":22,"tag":30,"props":149,"children":150},{},[151],{"type":28,"value":152},"常见原因有三个：",{"type":22,"tag":154,"props":155,"children":156},"ol",{},[157,169,174],{"type":22,"tag":158,"props":159,"children":160},"li",{},[161,163],{"type":28,"value":162},"构建机无法访问 ",{"type":22,"tag":15,"props":164,"children":166},{"className":165},[],[167],{"type":28,"value":168},"fonts.googleapis.com",{"type":22,"tag":158,"props":170,"children":171},{},[172],{"type":28,"value":173},"CI 环境禁用了外网请求或 DNS 解析不稳定",{"type":22,"tag":158,"props":175,"children":176},{},[177],{"type":28,"value":178},"UnoCSS 在构建阶段尝试下载远程字体 CSS",{"type":22,"tag":30,"props":180,"children":181},{},[182,184,190],{"type":28,"value":183},"问题不在 Nuxt Content，也不是 Markdown 文件格式错误。真正触发网络请求的通常是 ",{"type":22,"tag":15,"props":185,"children":187},{"className":186},[],[188],{"type":28,"value":189},"@unocss/preset-web-fonts",{"type":28,"value":191}," 或 UnoCSS 配置中的字体预设。",{"type":22,"tag":30,"props":193,"children":194},{},[195,197,203],{"type":28,"value":196},"可以先检查 ",{"type":22,"tag":15,"props":198,"children":200},{"className":199},[],[201],{"type":28,"value":202},"uno.config.ts",{"type":28,"value":204}," 里是否存在类似配置：",{"type":22,"tag":59,"props":206,"children":210},{"className":207,"code":208,"language":209,"meta":7,"style":7},"language-ts shiki shiki-themes vitesse-light vitesse-dark monokai","presetWebFonts({\n  provider: 'google',\n  fonts: {\n    sans: 'Inter',\n    cn: 'Noto Sans Simplified Chinese',\n  },\n})\n","ts",[211],{"type":22,"tag":15,"props":212,"children":213},{"__ignoreMap":7},[214,228,262,275,305,335,344],{"type":22,"tag":69,"props":215,"children":216},{"class":71,"line":72},[217,222],{"type":22,"tag":69,"props":218,"children":219},{"style":76},[220],{"type":28,"value":221},"presetWebFonts",{"type":22,"tag":69,"props":223,"children":225},{"style":224},"--shiki-default:#999999;--shiki-dark:#666666;--shiki-sepia:#F8F8F2",[226],{"type":28,"value":227},"({\n",{"type":22,"tag":69,"props":229,"children":230},{"class":71,"line":114},[231,237,242,248,253,257],{"type":22,"tag":69,"props":232,"children":234},{"style":233},"--shiki-default:#998418;--shiki-dark:#B8A965;--shiki-sepia:#F8F8F2",[235],{"type":28,"value":236},"  provider",{"type":22,"tag":69,"props":238,"children":239},{"style":224},[240],{"type":28,"value":241},": ",{"type":22,"tag":69,"props":243,"children":245},{"style":244},"--shiki-default:#B5695977;--shiki-dark:#C98A7D77;--shiki-sepia:#E6DB74",[246],{"type":28,"value":247},"'",{"type":22,"tag":69,"props":249,"children":250},{"style":82},[251],{"type":28,"value":252},"google",{"type":22,"tag":69,"props":254,"children":255},{"style":244},[256],{"type":28,"value":247},{"type":22,"tag":69,"props":258,"children":259},{"style":224},[260],{"type":28,"value":261},",\n",{"type":22,"tag":69,"props":263,"children":264},{"class":71,"line":123},[265,270],{"type":22,"tag":69,"props":266,"children":267},{"style":233},[268],{"type":28,"value":269},"  fonts",{"type":22,"tag":69,"props":271,"children":272},{"style":224},[273],{"type":28,"value":274},": {\n",{"type":22,"tag":69,"props":276,"children":278},{"class":71,"line":277},4,[279,284,288,292,297,301],{"type":22,"tag":69,"props":280,"children":281},{"style":233},[282],{"type":28,"value":283},"    sans",{"type":22,"tag":69,"props":285,"children":286},{"style":224},[287],{"type":28,"value":241},{"type":22,"tag":69,"props":289,"children":290},{"style":244},[291],{"type":28,"value":247},{"type":22,"tag":69,"props":293,"children":294},{"style":82},[295],{"type":28,"value":296},"Inter",{"type":22,"tag":69,"props":298,"children":299},{"style":244},[300],{"type":28,"value":247},{"type":22,"tag":69,"props":302,"children":303},{"style":224},[304],{"type":28,"value":261},{"type":22,"tag":69,"props":306,"children":308},{"class":71,"line":307},5,[309,314,318,322,327,331],{"type":22,"tag":69,"props":310,"children":311},{"style":233},[312],{"type":28,"value":313},"    cn",{"type":22,"tag":69,"props":315,"children":316},{"style":224},[317],{"type":28,"value":241},{"type":22,"tag":69,"props":319,"children":320},{"style":244},[321],{"type":28,"value":247},{"type":22,"tag":69,"props":323,"children":324},{"style":82},[325],{"type":28,"value":326},"Noto Sans Simplified Chinese",{"type":22,"tag":69,"props":328,"children":329},{"style":244},[330],{"type":28,"value":247},{"type":22,"tag":69,"props":332,"children":333},{"style":224},[334],{"type":28,"value":261},{"type":22,"tag":69,"props":336,"children":338},{"class":71,"line":337},6,[339],{"type":22,"tag":69,"props":340,"children":341},{"style":224},[342],{"type":28,"value":343},"  },\n",{"type":22,"tag":69,"props":345,"children":347},{"class":71,"line":346},7,[348],{"type":22,"tag":69,"props":349,"children":350},{"style":224},[351],{"type":28,"value":352},"})\n",{"type":22,"tag":30,"props":354,"children":355},{},[356],{"type":28,"value":357},"只要构建阶段依赖 Google Fonts，网络不可用时就有概率复现。",{"type":22,"tag":48,"props":359,"children":361},{"id":360},"方案一改成本地字体",[362],{"type":28,"value":363},"方案一：改成本地字体",{"type":22,"tag":30,"props":365,"children":366},{},[367,369,375,377,383],{"type":28,"value":368},"最稳定的方式是把字体文件放进 ",{"type":22,"tag":15,"props":370,"children":372},{"className":371},[],[373],{"type":28,"value":374},"public/fonts",{"type":28,"value":376},"，再通过 CSS 声明 ",{"type":22,"tag":15,"props":378,"children":380},{"className":379},[],[381],{"type":28,"value":382},"@font-face",{"type":28,"value":384},"。这样构建不需要访问外网。",{"type":22,"tag":30,"props":386,"children":387},{},[388],{"type":28,"value":389},"目录示例：",{"type":22,"tag":59,"props":391,"children":393},{"className":98,"code":392,"language":28,"meta":7,"style":7},"public/\n  fonts/\n    Inter-Regular.woff2\n    NotoSansSC-Regular.woff2\n",[394],{"type":22,"tag":15,"props":395,"children":396},{"__ignoreMap":7},[397,405,413,421],{"type":22,"tag":69,"props":398,"children":399},{"class":71,"line":72},[400],{"type":22,"tag":69,"props":401,"children":402},{},[403],{"type":28,"value":404},"public/\n",{"type":22,"tag":69,"props":406,"children":407},{"class":71,"line":114},[408],{"type":22,"tag":69,"props":409,"children":410},{},[411],{"type":28,"value":412},"  fonts/\n",{"type":22,"tag":69,"props":414,"children":415},{"class":71,"line":123},[416],{"type":22,"tag":69,"props":417,"children":418},{},[419],{"type":28,"value":420},"    Inter-Regular.woff2\n",{"type":22,"tag":69,"props":422,"children":423},{"class":71,"line":277},[424],{"type":22,"tag":69,"props":425,"children":426},{},[427],{"type":28,"value":428},"    NotoSansSC-Regular.woff2\n",{"type":22,"tag":30,"props":430,"children":431},{},[432],{"type":28,"value":433},"在全局样式里声明：",{"type":22,"tag":59,"props":435,"children":439},{"className":436,"code":437,"language":438,"meta":7,"style":7},"language-scss shiki shiki-themes vitesse-light vitesse-dark monokai","@font-face {\n  font-family: 'Inter Local';\n  src: url('/fonts/Inter-Regular.woff2') format('woff2');\n  font-weight: 400;\n  font-style: normal;\n  font-display: swap;\n}\n\n@font-face {\n  font-family: 'Noto Sans SC Local';\n  src: url('/fonts/NotoSansSC-Regular.woff2') format('woff2');\n  font-weight: 400;\n  font-style: normal;\n  font-display: swap;\n}\n\nbody {\n  font-family: 'Inter Local', 'Noto Sans SC Local', system-ui, sans-serif;\n}\n","scss",[440],{"type":22,"tag":15,"props":441,"children":442},{"__ignoreMap":7},[443,451,459,467,475,483,491,499,509,517,526,535,543,551,559,567,575,584,593],{"type":22,"tag":69,"props":444,"children":445},{"class":71,"line":72},[446],{"type":22,"tag":69,"props":447,"children":448},{},[449],{"type":28,"value":450},"@font-face {\n",{"type":22,"tag":69,"props":452,"children":453},{"class":71,"line":114},[454],{"type":22,"tag":69,"props":455,"children":456},{},[457],{"type":28,"value":458},"  font-family: 'Inter Local';\n",{"type":22,"tag":69,"props":460,"children":461},{"class":71,"line":123},[462],{"type":22,"tag":69,"props":463,"children":464},{},[465],{"type":28,"value":466},"  src: url('/fonts/Inter-Regular.woff2') format('woff2');\n",{"type":22,"tag":69,"props":468,"children":469},{"class":71,"line":277},[470],{"type":22,"tag":69,"props":471,"children":472},{},[473],{"type":28,"value":474},"  font-weight: 400;\n",{"type":22,"tag":69,"props":476,"children":477},{"class":71,"line":307},[478],{"type":22,"tag":69,"props":479,"children":480},{},[481],{"type":28,"value":482},"  font-style: normal;\n",{"type":22,"tag":69,"props":484,"children":485},{"class":71,"line":337},[486],{"type":22,"tag":69,"props":487,"children":488},{},[489],{"type":28,"value":490},"  font-display: swap;\n",{"type":22,"tag":69,"props":492,"children":493},{"class":71,"line":346},[494],{"type":22,"tag":69,"props":495,"children":496},{},[497],{"type":28,"value":498},"}\n",{"type":22,"tag":69,"props":500,"children":502},{"class":71,"line":501},8,[503],{"type":22,"tag":69,"props":504,"children":506},{"emptyLinePlaceholder":505},true,[507],{"type":28,"value":508},"\n",{"type":22,"tag":69,"props":510,"children":512},{"class":71,"line":511},9,[513],{"type":22,"tag":69,"props":514,"children":515},{},[516],{"type":28,"value":450},{"type":22,"tag":69,"props":518,"children":520},{"class":71,"line":519},10,[521],{"type":22,"tag":69,"props":522,"children":523},{},[524],{"type":28,"value":525},"  font-family: 'Noto Sans SC Local';\n",{"type":22,"tag":69,"props":527,"children":529},{"class":71,"line":528},11,[530],{"type":22,"tag":69,"props":531,"children":532},{},[533],{"type":28,"value":534},"  src: url('/fonts/NotoSansSC-Regular.woff2') format('woff2');\n",{"type":22,"tag":69,"props":536,"children":538},{"class":71,"line":537},12,[539],{"type":22,"tag":69,"props":540,"children":541},{},[542],{"type":28,"value":474},{"type":22,"tag":69,"props":544,"children":546},{"class":71,"line":545},13,[547],{"type":22,"tag":69,"props":548,"children":549},{},[550],{"type":28,"value":482},{"type":22,"tag":69,"props":552,"children":554},{"class":71,"line":553},14,[555],{"type":22,"tag":69,"props":556,"children":557},{},[558],{"type":28,"value":490},{"type":22,"tag":69,"props":560,"children":562},{"class":71,"line":561},15,[563],{"type":22,"tag":69,"props":564,"children":565},{},[566],{"type":28,"value":498},{"type":22,"tag":69,"props":568,"children":570},{"class":71,"line":569},16,[571],{"type":22,"tag":69,"props":572,"children":573},{"emptyLinePlaceholder":505},[574],{"type":28,"value":508},{"type":22,"tag":69,"props":576,"children":578},{"class":71,"line":577},17,[579],{"type":22,"tag":69,"props":580,"children":581},{},[582],{"type":28,"value":583},"body {\n",{"type":22,"tag":69,"props":585,"children":587},{"class":71,"line":586},18,[588],{"type":22,"tag":69,"props":589,"children":590},{},[591],{"type":28,"value":592},"  font-family: 'Inter Local', 'Noto Sans SC Local', system-ui, sans-serif;\n",{"type":22,"tag":69,"props":594,"children":596},{"class":71,"line":595},19,[597],{"type":22,"tag":69,"props":598,"children":599},{},[600],{"type":28,"value":498},{"type":22,"tag":30,"props":602,"children":603},{},[604],{"type":28,"value":605},"这个方案适合部署到 GitHub Pages、Vercel、Netlify 或任何静态托管平台。字体文件会随站点一起发布，不依赖第三方服务。",{"type":22,"tag":48,"props":607,"children":609},{"id":608},"方案二移除构建期字体下载",[610],{"type":28,"value":611},"方案二：移除构建期字体下载",{"type":22,"tag":30,"props":613,"children":614},{},[615],{"type":28,"value":616},"如果不想维护字体文件，可以直接使用系统字体栈。Nuxt 博客类项目通常不需要在构建阶段强依赖远程字体。",{"type":22,"tag":30,"props":618,"children":619},{},[620,622,627,629,634],{"type":28,"value":621},"可以在 ",{"type":22,"tag":15,"props":623,"children":625},{"className":624},[],[626],{"type":28,"value":202},{"type":28,"value":628}," 中移除 ",{"type":22,"tag":15,"props":630,"children":632},{"className":631},[],[633],{"type":28,"value":221},{"type":28,"value":635},"，保留普通的 UnoCSS 预设：",{"type":22,"tag":59,"props":637,"children":639},{"className":207,"code":638,"language":209,"meta":7,"style":7},"import { defineConfig, presetUno, presetIcons } from 'unocss'\n\nexport default defineConfig({\n  presets: [\n    presetUno(),\n    presetIcons(),\n  ],\n})\n",[640],{"type":22,"tag":15,"props":641,"children":642},{"__ignoreMap":7},[643,707,714,735,748,761,773,781],{"type":22,"tag":69,"props":644,"children":645},{"class":71,"line":72},[646,652,657,663,668,673,677,682,687,692,697,702],{"type":22,"tag":69,"props":647,"children":649},{"style":648},"--shiki-default:#1E754F;--shiki-dark:#4D9375;--shiki-sepia:#F92672",[650],{"type":28,"value":651},"import",{"type":22,"tag":69,"props":653,"children":654},{"style":224},[655],{"type":28,"value":656}," {",{"type":22,"tag":69,"props":658,"children":660},{"style":659},"--shiki-default:#B07D48;--shiki-dark:#BD976A;--shiki-sepia:#F8F8F2",[661],{"type":28,"value":662}," defineConfig",{"type":22,"tag":69,"props":664,"children":665},{"style":224},[666],{"type":28,"value":667},",",{"type":22,"tag":69,"props":669,"children":670},{"style":659},[671],{"type":28,"value":672}," presetUno",{"type":22,"tag":69,"props":674,"children":675},{"style":224},[676],{"type":28,"value":667},{"type":22,"tag":69,"props":678,"children":679},{"style":659},[680],{"type":28,"value":681}," presetIcons",{"type":22,"tag":69,"props":683,"children":684},{"style":224},[685],{"type":28,"value":686}," }",{"type":22,"tag":69,"props":688,"children":689},{"style":648},[690],{"type":28,"value":691}," from",{"type":22,"tag":69,"props":693,"children":694},{"style":244},[695],{"type":28,"value":696}," '",{"type":22,"tag":69,"props":698,"children":699},{"style":82},[700],{"type":28,"value":701},"unocss",{"type":22,"tag":69,"props":703,"children":704},{"style":244},[705],{"type":28,"value":706},"'\n",{"type":22,"tag":69,"props":708,"children":709},{"class":71,"line":114},[710],{"type":22,"tag":69,"props":711,"children":712},{"emptyLinePlaceholder":505},[713],{"type":28,"value":508},{"type":22,"tag":69,"props":715,"children":716},{"class":71,"line":123},[717,722,727,731],{"type":22,"tag":69,"props":718,"children":719},{"style":648},[720],{"type":28,"value":721},"export",{"type":22,"tag":69,"props":723,"children":724},{"style":648},[725],{"type":28,"value":726}," default",{"type":22,"tag":69,"props":728,"children":729},{"style":76},[730],{"type":28,"value":662},{"type":22,"tag":69,"props":732,"children":733},{"style":224},[734],{"type":28,"value":227},{"type":22,"tag":69,"props":736,"children":737},{"class":71,"line":277},[738,743],{"type":22,"tag":69,"props":739,"children":740},{"style":233},[741],{"type":28,"value":742},"  presets",{"type":22,"tag":69,"props":744,"children":745},{"style":224},[746],{"type":28,"value":747},": [\n",{"type":22,"tag":69,"props":749,"children":750},{"class":71,"line":307},[751,756],{"type":22,"tag":69,"props":752,"children":753},{"style":76},[754],{"type":28,"value":755},"    presetUno",{"type":22,"tag":69,"props":757,"children":758},{"style":224},[759],{"type":28,"value":760},"(),\n",{"type":22,"tag":69,"props":762,"children":763},{"class":71,"line":337},[764,769],{"type":22,"tag":69,"props":765,"children":766},{"style":76},[767],{"type":28,"value":768},"    presetIcons",{"type":22,"tag":69,"props":770,"children":771},{"style":224},[772],{"type":28,"value":760},{"type":22,"tag":69,"props":774,"children":775},{"class":71,"line":346},[776],{"type":22,"tag":69,"props":777,"children":778},{"style":224},[779],{"type":28,"value":780},"  ],\n",{"type":22,"tag":69,"props":782,"children":783},{"class":71,"line":501},[784],{"type":22,"tag":69,"props":785,"children":786},{"style":224},[787],{"type":28,"value":352},{"type":22,"tag":30,"props":789,"children":790},{},[791],{"type":28,"value":792},"然后在 CSS 中使用系统字体：",{"type":22,"tag":59,"props":794,"children":796},{"className":436,"code":795,"language":438,"meta":7,"style":7},"body {\n  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,\n    'Segoe UI', sans-serif;\n}\n",[797],{"type":22,"tag":15,"props":798,"children":799},{"__ignoreMap":7},[800,807,815,823],{"type":22,"tag":69,"props":801,"children":802},{"class":71,"line":72},[803],{"type":22,"tag":69,"props":804,"children":805},{},[806],{"type":28,"value":583},{"type":22,"tag":69,"props":808,"children":809},{"class":71,"line":114},[810],{"type":22,"tag":69,"props":811,"children":812},{},[813],{"type":28,"value":814},"  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,\n",{"type":22,"tag":69,"props":816,"children":817},{"class":71,"line":123},[818],{"type":22,"tag":69,"props":819,"children":820},{},[821],{"type":28,"value":822},"    'Segoe UI', sans-serif;\n",{"type":22,"tag":69,"props":824,"children":825},{"class":71,"line":277},[826],{"type":22,"tag":69,"props":827,"children":828},{},[829],{"type":28,"value":498},{"type":22,"tag":30,"props":831,"children":832},{},[833],{"type":28,"value":834},"这样做的优点是最轻量，缺点是不同系统上的字体观感会有一点差异。",{"type":22,"tag":48,"props":836,"children":838},{"id":837},"方案三只在可联网环境启用-web-fonts",[839],{"type":28,"value":840},"方案三：只在可联网环境启用 Web Fonts",{"type":22,"tag":30,"props":842,"children":843},{},[844],{"type":28,"value":845},"如果本地开发希望继续使用 Google Fonts，而 CI 或自动化生成环境要保持稳定，可以用环境变量控制配置。",{"type":22,"tag":59,"props":847,"children":849},{"className":207,"code":848,"language":209,"meta":7,"style":7},"const enableWebFonts = process.env.ENABLE_WEB_FONTS === 'true'\n\nexport default defineConfig({\n  presets: [\n    presetUno(),\n    enableWebFonts\n      ? presetWebFonts({\n          provider: 'google',\n          fonts: {\n            sans: 'Inter',\n          },\n        })\n      : null,\n  ].filter(Boolean),\n})\n",[850],{"type":22,"tag":15,"props":851,"children":852},{"__ignoreMap":7},[853,916,923,942,953,964,972,989,1017,1029,1057,1065,1073,1091,1119],{"type":22,"tag":69,"props":854,"children":855},{"class":71,"line":72},[856,862,867,873,878,883,888,892,897,903,907,912],{"type":22,"tag":69,"props":857,"children":859},{"style":858},"--shiki-default:#AB5959;--shiki-default-font-style:inherit;--shiki-dark:#CB7676;--shiki-dark-font-style:inherit;--shiki-sepia:#66D9EF;--shiki-sepia-font-style:italic",[860],{"type":28,"value":861},"const",{"type":22,"tag":69,"props":863,"children":864},{"style":659},[865],{"type":28,"value":866}," enableWebFonts",{"type":22,"tag":69,"props":868,"children":870},{"style":869},"--shiki-default:#999999;--shiki-dark:#666666;--shiki-sepia:#F92672",[871],{"type":28,"value":872}," =",{"type":22,"tag":69,"props":874,"children":875},{"style":659},[876],{"type":28,"value":877}," process",{"type":22,"tag":69,"props":879,"children":880},{"style":224},[881],{"type":28,"value":882},".",{"type":22,"tag":69,"props":884,"children":885},{"style":659},[886],{"type":28,"value":887},"env",{"type":22,"tag":69,"props":889,"children":890},{"style":224},[891],{"type":28,"value":882},{"type":22,"tag":69,"props":893,"children":894},{"style":659},[895],{"type":28,"value":896},"ENABLE_WEB_FONTS",{"type":22,"tag":69,"props":898,"children":900},{"style":899},"--shiki-default:#AB5959;--shiki-dark:#CB7676;--shiki-sepia:#F92672",[901],{"type":28,"value":902}," ===",{"type":22,"tag":69,"props":904,"children":905},{"style":244},[906],{"type":28,"value":696},{"type":22,"tag":69,"props":908,"children":909},{"style":82},[910],{"type":28,"value":911},"true",{"type":22,"tag":69,"props":913,"children":914},{"style":244},[915],{"type":28,"value":706},{"type":22,"tag":69,"props":917,"children":918},{"class":71,"line":114},[919],{"type":22,"tag":69,"props":920,"children":921},{"emptyLinePlaceholder":505},[922],{"type":28,"value":508},{"type":22,"tag":69,"props":924,"children":925},{"class":71,"line":123},[926,930,934,938],{"type":22,"tag":69,"props":927,"children":928},{"style":648},[929],{"type":28,"value":721},{"type":22,"tag":69,"props":931,"children":932},{"style":648},[933],{"type":28,"value":726},{"type":22,"tag":69,"props":935,"children":936},{"style":76},[937],{"type":28,"value":662},{"type":22,"tag":69,"props":939,"children":940},{"style":224},[941],{"type":28,"value":227},{"type":22,"tag":69,"props":943,"children":944},{"class":71,"line":277},[945,949],{"type":22,"tag":69,"props":946,"children":947},{"style":233},[948],{"type":28,"value":742},{"type":22,"tag":69,"props":950,"children":951},{"style":224},[952],{"type":28,"value":747},{"type":22,"tag":69,"props":954,"children":955},{"class":71,"line":307},[956,960],{"type":22,"tag":69,"props":957,"children":958},{"style":76},[959],{"type":28,"value":755},{"type":22,"tag":69,"props":961,"children":962},{"style":224},[963],{"type":28,"value":760},{"type":22,"tag":69,"props":965,"children":966},{"class":71,"line":337},[967],{"type":22,"tag":69,"props":968,"children":969},{"style":659},[970],{"type":28,"value":971},"    enableWebFonts\n",{"type":22,"tag":69,"props":973,"children":974},{"class":71,"line":346},[975,980,985],{"type":22,"tag":69,"props":976,"children":977},{"style":899},[978],{"type":28,"value":979},"      ?",{"type":22,"tag":69,"props":981,"children":982},{"style":76},[983],{"type":28,"value":984}," presetWebFonts",{"type":22,"tag":69,"props":986,"children":987},{"style":224},[988],{"type":28,"value":227},{"type":22,"tag":69,"props":990,"children":991},{"class":71,"line":501},[992,997,1001,1005,1009,1013],{"type":22,"tag":69,"props":993,"children":994},{"style":233},[995],{"type":28,"value":996},"          provider",{"type":22,"tag":69,"props":998,"children":999},{"style":224},[1000],{"type":28,"value":241},{"type":22,"tag":69,"props":1002,"children":1003},{"style":244},[1004],{"type":28,"value":247},{"type":22,"tag":69,"props":1006,"children":1007},{"style":82},[1008],{"type":28,"value":252},{"type":22,"tag":69,"props":1010,"children":1011},{"style":244},[1012],{"type":28,"value":247},{"type":22,"tag":69,"props":1014,"children":1015},{"style":224},[1016],{"type":28,"value":261},{"type":22,"tag":69,"props":1018,"children":1019},{"class":71,"line":511},[1020,1025],{"type":22,"tag":69,"props":1021,"children":1022},{"style":233},[1023],{"type":28,"value":1024},"          fonts",{"type":22,"tag":69,"props":1026,"children":1027},{"style":224},[1028],{"type":28,"value":274},{"type":22,"tag":69,"props":1030,"children":1031},{"class":71,"line":519},[1032,1037,1041,1045,1049,1053],{"type":22,"tag":69,"props":1033,"children":1034},{"style":233},[1035],{"type":28,"value":1036},"            sans",{"type":22,"tag":69,"props":1038,"children":1039},{"style":224},[1040],{"type":28,"value":241},{"type":22,"tag":69,"props":1042,"children":1043},{"style":244},[1044],{"type":28,"value":247},{"type":22,"tag":69,"props":1046,"children":1047},{"style":82},[1048],{"type":28,"value":296},{"type":22,"tag":69,"props":1050,"children":1051},{"style":244},[1052],{"type":28,"value":247},{"type":22,"tag":69,"props":1054,"children":1055},{"style":224},[1056],{"type":28,"value":261},{"type":22,"tag":69,"props":1058,"children":1059},{"class":71,"line":528},[1060],{"type":22,"tag":69,"props":1061,"children":1062},{"style":224},[1063],{"type":28,"value":1064},"          },\n",{"type":22,"tag":69,"props":1066,"children":1067},{"class":71,"line":537},[1068],{"type":22,"tag":69,"props":1069,"children":1070},{"style":224},[1071],{"type":28,"value":1072},"        })\n",{"type":22,"tag":69,"props":1074,"children":1075},{"class":71,"line":545},[1076,1081,1087],{"type":22,"tag":69,"props":1077,"children":1078},{"style":899},[1079],{"type":28,"value":1080},"      :",{"type":22,"tag":69,"props":1082,"children":1084},{"style":1083},"--shiki-default:#AB5959;--shiki-dark:#CB7676;--shiki-sepia:#AE81FF",[1085],{"type":28,"value":1086}," null",{"type":22,"tag":69,"props":1088,"children":1089},{"style":224},[1090],{"type":28,"value":261},{"type":22,"tag":69,"props":1092,"children":1093},{"class":71,"line":553},[1094,1099,1104,1109,1114],{"type":22,"tag":69,"props":1095,"children":1096},{"style":224},[1097],{"type":28,"value":1098},"  ].",{"type":22,"tag":69,"props":1100,"children":1101},{"style":76},[1102],{"type":28,"value":1103},"filter",{"type":22,"tag":69,"props":1105,"children":1106},{"style":224},[1107],{"type":28,"value":1108},"(",{"type":22,"tag":69,"props":1110,"children":1111},{"style":659},[1112],{"type":28,"value":1113},"Boolean",{"type":22,"tag":69,"props":1115,"children":1116},{"style":224},[1117],{"type":28,"value":1118},"),\n",{"type":22,"tag":69,"props":1120,"children":1121},{"class":71,"line":561},[1122],{"type":22,"tag":69,"props":1123,"children":1124},{"style":224},[1125],{"type":28,"value":352},{"type":22,"tag":30,"props":1127,"children":1128},{},[1129],{"type":28,"value":1130},"本地联网开发时运行：",{"type":22,"tag":59,"props":1132,"children":1134},{"className":61,"code":1133,"language":63,"meta":7,"style":7},"ENABLE_WEB_FONTS=true pnpm run dev\n",[1135],{"type":22,"tag":15,"props":1136,"children":1137},{"__ignoreMap":7},[1138],{"type":22,"tag":69,"props":1139,"children":1140},{"class":71,"line":72},[1141,1145,1150,1154,1159,1163],{"type":22,"tag":69,"props":1142,"children":1143},{"style":659},[1144],{"type":28,"value":896},{"type":22,"tag":69,"props":1146,"children":1147},{"style":869},[1148],{"type":28,"value":1149},"=",{"type":22,"tag":69,"props":1151,"children":1152},{"style":82},[1153],{"type":28,"value":911},{"type":22,"tag":69,"props":1155,"children":1156},{"style":76},[1157],{"type":28,"value":1158}," pnpm",{"type":22,"tag":69,"props":1160,"children":1161},{"style":82},[1162],{"type":28,"value":85},{"type":22,"tag":69,"props":1164,"children":1165},{"style":82},[1166],{"type":28,"value":1167}," dev\n",{"type":22,"tag":30,"props":1169,"children":1170},{},[1171],{"type":28,"value":1172},"CI 或定时生成时不设置这个变量，就不会触发远程字体下载。",{"type":22,"tag":48,"props":1174,"children":1176},{"id":1175},"如何验证",[1177],{"type":28,"value":1175},{"type":22,"tag":30,"props":1179,"children":1180},{},[1181],{"type":28,"value":1182},"修改后重新生成：",{"type":22,"tag":59,"props":1184,"children":1185},{"className":61,"code":62,"language":63,"meta":7,"style":7},[1186],{"type":22,"tag":15,"props":1187,"children":1188},{"__ignoreMap":7},[1189],{"type":22,"tag":69,"props":1190,"children":1191},{"class":71,"line":72},[1192,1196,1200],{"type":22,"tag":69,"props":1193,"children":1194},{"style":76},[1195],{"type":28,"value":79},{"type":22,"tag":69,"props":1197,"children":1198},{"style":82},[1199],{"type":28,"value":85},{"type":22,"tag":69,"props":1201,"children":1202},{"style":82},[1203],{"type":28,"value":90},{"type":22,"tag":30,"props":1205,"children":1206},{},[1207],{"type":28,"value":1208},"重点看三件事：",{"type":22,"tag":154,"props":1210,"children":1211},{},[1212,1222,1232],{"type":22,"tag":158,"props":1213,"children":1214},{},[1215,1217],{"type":28,"value":1216},"日志里不再出现 ",{"type":22,"tag":15,"props":1218,"children":1220},{"className":1219},[],[1221],{"type":28,"value":40},{"type":22,"tag":158,"props":1223,"children":1224},{},[1225,1230],{"type":22,"tag":15,"props":1226,"children":1228},{"className":1227},[],[1229],{"type":28,"value":140},{"type":28,"value":1231}," 正常生成",{"type":22,"tag":158,"props":1233,"children":1234},{},[1235],{"type":28,"value":1236},"打开页面后中文、英文和代码字体都可读",{"type":22,"tag":30,"props":1238,"children":1239},{},[1240],{"type":28,"value":1241},"如果项目已经有发布流水线，还可以再看一次部署日志，确认静态生成阶段没有访问 Google Fonts 失败的错误。",{"type":22,"tag":48,"props":1243,"children":1245},{"id":1244},"总结",[1246],{"type":28,"value":1244},{"type":22,"tag":30,"props":1248,"children":1249},{},[1250,1256],{"type":22,"tag":15,"props":1251,"children":1253},{"className":1252},[],[1254],{"type":28,"value":1255},"nuxt generate",{"type":28,"value":1257}," 里的 Google Fonts 报错，本质是构建阶段依赖远程资源。对静态博客来说，最稳妥的处理方式是本地化字体，或者退回系统字体栈。",{"type":22,"tag":30,"props":1259,"children":1260},{},[1261],{"type":28,"value":1262},"字体属于展示增强，不应该成为文章发布失败的原因。把外部依赖从构建链路里拿掉，自动化发布才会更可靠。",{"type":22,"tag":1264,"props":1265,"children":1266},"style",{},[1267],{"type":28,"value":1268},"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 .sepia .shiki span {color: var(--shiki-sepia);background: var(--shiki-sepia-bg);font-style: var(--shiki-sepia-font-style);font-weight: var(--shiki-sepia-font-weight);text-decoration: var(--shiki-sepia-text-decoration);}html.sepia .shiki span {color: var(--shiki-sepia);background: var(--shiki-sepia-bg);font-style: var(--shiki-sepia-font-style);font-weight: var(--shiki-sepia-font-weight);text-decoration: var(--shiki-sepia-text-decoration);}",{"title":7,"searchDepth":114,"depth":114,"links":1270},[1271,1272,1273,1274,1275,1276,1277],{"id":50,"depth":114,"text":50},{"id":145,"depth":114,"text":145},{"id":360,"depth":114,"text":363},{"id":608,"depth":114,"text":611},{"id":837,"depth":114,"text":840},{"id":1175,"depth":114,"text":1175},{"id":1244,"depth":114,"text":1244},"markdown","content:blog:2026-06-04-nuxt-generate-google-fonts.md","content","blog/2026-06-04-nuxt-generate-google-fonts.md","blog/2026-06-04-nuxt-generate-google-fonts","md",1780733631884]