如何将导出脚本合并到已有的next.config.js配置文件中

合并后的完整next.config.js配置 #

require('dotenv').config()

const withFonts = require('next-fonts')
// 新增引入项目数据文件
const data = require('./utils/projectsData');

module.exports = withFonts({
  serverRuntimeConfig: {},
  // 原有配置已满足trailingSlash要求，无需修改
  trailingSlash: true,
  // 改造exportPathMap为异步方法，补充动态路由生成逻辑
  exportPathMap: async function() {
    const { projects } = data;
    const paths = {
      '/': { page: '/' },
    };

    projects.forEach((project) => {
      paths[`/project/${project.slug}`] = {
        page: '/project/[path]',
        query: { path: project.slug },
      };
    });

    return paths;
  },
  // 原有运行时配置全部保留，无需修改
  publicRuntimeConfig: {
    API_URL: process.env.API_URL,
    PORT: process.env.PORT || 3000,
    PUBLISHABLE_KEY: process.env.PUBLISHABLE_KEY,
  },
})

核心改动说明 #

• 仅在文件顶部新增projectsData的引入，不改动原有dotenv、next-fonts的初始化逻辑
• 保留外层withFonts插件包裹逻辑，不影响原有字体加载功能
• 原有trailingSlash配置已经符合要求，无需重复设置
• 改造原有exportPathMap为异步方法，补充动态生成项目详情页路由的逻辑，原有首页路由规则保留
• 所有原有运行时配置项全部保留，不会影响现有业务逻辑

注意确认./utils/projectsData的文件路径和你项目中的实际存储路径一致即可。

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