Docusaurus config - syntax unclear

Question

I just created a fresh installation of Docusaurus 3.1. Now I want to enable Mermaid. The documentation says:

export default {
  markdown: {
    mermaid: true,
  },
  themes: ['@docusaurus/theme-mermaid'],
};

But when I open the docusarus.config.js and add these lines, I get an error:

Cause: ParseError: Only one default export allowed per module.  

So it is not clear to me how I should add plugins to Docusaurus. I added the code block at the end of the configuration files:

export default config;

export default {
  markdown: {
    mermaid: true,
  },
  themes: ['@docusaurus/theme-mermaid'],
};

Answer 1

You cannot export default two separate things from the same file. What they want you to do is take the provided code to export and combine it with what's already being exported, which in this case is the config object.

To do that, take this part of the provided code:

  markdown: {
    mermaid: true,
  },
  themes: ['@docusaurus/theme-mermaid'],

And place it inside your config object. Like this:

const config = {

  markdown: {
    mermaid: true,
  },
  themes: ['@docusaurus/theme-mermaid'],

  ...the rest of the code that's already in there...

}

That you need to do this instead of just pasting in the provided code as-is is clear to a coder, but yes, I agree it's not clear to someone without a coding background.