md hardbreaks

to make writing more convenient

type: fragment

cluster: tech
astro js and remark-breaks
https://github.com/remarkjs/remark-breaks

gemini reckon me this

import { defineConfig } from 'astro/config';
import remarkBreaks from 'remark-breaks'; // <-- 1. Import the plugin

export default defineConfig({
  // ...other config
  markdown: {
    remarkPlugins: [remarkBreaks], // <-- 2. Add it here
  },
});

got this error

[config] Astro found issue(s) with your configuration:

! markdown.remarkPlugins.0: Did not match union.
  > Expected type string |  |  |
  > Received [ null ]

error: script "dev" exited with code 1

gemini:

This error message `Received [ null ]` usually means the plugin isn't being imported correctly (the variable `remarkBreaks` is turning up empty). This often happens due to differences in how JavaScript handles "imports" (ESM vs CommonJS) in configuration files.

Let's fix this using the **String Method**. Astro is smart enough to find the plugin by its name, which avoids these import issues entirely.

**Update your `astro.config.mjs` to look like this:**

JavaScript

import { defineConfig } from 'astro/config';
// You can remove the import line: import remarkBreaks from 'remark-breaks';

export default defineConfig({
  // ...other config settings
  markdown: {
    // Just use the package name as a string
    remarkPlugins: ['remark-breaks'], 
  },
});

### Why does this happen?

Sometimes, depending on your exact Node/Bun version or the package version, `import x from 'y'` results in an empty object instead of the actual function. Passing the string `'remark-breaks'` tells Astro, "Go find this package in `node_modules` and load it yourself," which is much safer.

**Try running `bun run dev` (or `npm run dev`) again after making this change.**

wisdom of this story:

created on: Thu Nov 13 2025