adding export script to an existing next.config.js

Question

I'm following Microsoft's Tutorial: Deploy static-rendered Next.js websites on Azure Static Web Apps

The problem is, I'm trying to add to my next.config.js file this code:

const data = require('./utils/projectsData');

module.exports = {
  trailingSlash: true,
  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;
  },
};

but my next.config.js already has some existing content:

require('dotenv').config()

const withFonts = require('next-fonts')

module.exports = withFonts({
  serverRuntimeConfig: {},
  trailingSlash: true,
  exportPathMap: function() {
    return {
      '/': { page: '/' }
    };
  },
  publicRuntimeConfig: {
    API_URL: process.env.API_URL,
    PORT: process.env.PORT || 3000,
    PUBLISHABLE_KEY: process.env.PUBLISHABLE_KEY,
  },
})

how can I combine them?

score 1 · Accepted Answer · answered Jun 21 '21 at 15:23

Just combine them like that?

require('dotenv').config()

const data = require('./utils/projectsData'); // Add this line
const withFonts = require('next-fonts')

module.exports = withFonts({
  serverRuntimeConfig: {},
  trailingSlash: true,
  // And override this key
  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,
  },
})

adding export script to an existing next.config.js

1 Answers1