SvelteKit挂载ConfigMap中JSON文件不生效问题求助

核心原因是静态导入JSON文件会被SvelteKit编译打包进构建产物，运行时不会再读取本地文件，所以修改ConfigMap挂载的文件后，应用无法获取新内容。必须改用运行时动态读取文件的方式，以下是具体解决方案：

方案1：在Server端Load函数中动态读取文件 #

在+page.server.js中使用Node.js的fs模块读取挂载的JSON文件，而非静态导入。这样每次页面请求时都会读取最新的文件内容：

import fs from 'fs/promises';
import path from 'path';

export async function load() {
  // 替换为Kubernetes中ConfigMap挂载的实际文件路径
  const jsonFilePath = path.join(process.cwd(), 'mounted-data', 'items.json');
  
  try {
    const rawData = await fs.readFile(jsonFilePath, 'utf8');
    return { items: JSON.parse(rawData) };
  } catch (err) {
    console.error('读取items.json失败:', err);
    return { items: [] };
  }
}

在对应的+page.svelte中直接使用服务器返回的数据：

<select>
  {#each $data.items as item}
    <option value={item.value}>{item.label}</option>
  {/each}
</select>

方案2：提供API端点，前端定时获取最新数据 #

如果需要无需刷新页面就能更新数据，可以创建一个API端点，前端定时请求该接口获取最新内容：

1. 创建/api/items/+server.js：

import fs from 'fs/promises';
import path from 'path';

export async function GET() {
  const jsonFilePath = path.join(process.cwd(), 'mounted-data', 'items.json');
  
  try {
    const rawData = await fs.readFile(jsonFilePath, 'utf8');
    return new Response(rawData, {
      headers: { 'Content-Type': 'application/json' }
    });
  } catch (err) {
    return new Response(JSON.stringify([]), {
      status: 500,
      headers: { 'Content-Type': 'application/json' }
    });
  }
}

2. 在前端组件中定时请求API：

<script>
  import { onMount } from 'svelte';
  
  let items = [];

  async function fetchItems() {
    const res = await fetch('/api/items');
    items = await res.json();
  }

  onMount(() => {
    // 初始加载
    fetchItems();
    // 每30秒刷新一次，可根据需求调整间隔
    const interval = setInterval(fetchItems, 30000);
    return () => clearInterval(interval);
  });
</script>

<select>
  {#each items as item}
    <option value={item.value}>{item.label}</option>
  {/each}
</select>

关键注意事项 #

• 确保Kubernetes中ConfigMap的挂载路径与代码中指定的路径完全一致，比如挂载到容器内的/app/mounted-data/items.json，则代码中路径要对应。
• 检查Pod的权限设置，确保Node.js进程拥有读取挂载文件的权限。
• 如果使用SvelteKit的静态生成（SSG）模式，必须切换为SSR或混合模式，否则静态构建时会把JSON内容固化，无法动态更新。

内容的提问来源于stack exchange，提问作者BUCKSHOT