Starlight

Syntax highlighting of custom languages

To add syntax highlighting for a language that is not supported by Shiki by default, follow these instructions.

Example: Odin

• Find a suitable textmate json object file, such as this.
  • save the file to e.g. src/syntax/odin.tmLanguage.json
• Edit astro.config.js
  • Add:

Caution

You might need to modify the grammar file. I had to change the “name” from Odin to odin (lowercase) for the grammar to work.

  integrations: [starlight({
    title: 'jmn docs',
    expressiveCode: {
      plugins: [pluginLineNumbers()],
      shiki: {
        langs: [
          JSON.parse(fs.readFileSync('./src/syntax/odin.tmLanguage.json', 'utf-8'))
        ]
      }
    },
  ...

---

Example Odin code block

package main

import "core:fmt"

main :: proc() {
    fmt.println("Hellope, World!");
}

References