Pri migrácii môjho blogu zo Zola na Astro som narazil na problém so zvýrazňovaním syntaxe RouterOS. Astro používa Shiki na zvýrazňovanie kódu a Shiki RouterOS neobsahuje predvolene. Tu je návod, ako som to vyriešil.

Problém #

Pri zostavovaní Astro webu som videl upozornenia ako:

[Shiki] The language "routeros" doesn't exist, falling back to "plaintext".

Moje príspevky o konfigurácii MikroTik prichádzali o zvýrazňovanie syntaxe.

Hľadanie gramatiky #

Shiki používa TextMate gramatiky (formát .tmLanguage.json). Našiel som Atom balíček s gramatikou RouterOS vo formáte CSON:

https://github.com/ofstudio/atom-language-routeros-script

CSON (CoffeeScript Object Notation) je v podstate čitateľnejší JSON, takže konverzia je priamočiara.

Konverzia CSON na JSON #

Najprv vytvor adresár pre gramatiky a stiahni gramatiku:

mkdir -p src/grammars
wget -q https://raw.githubusercontent.com/ofstudio/atom-language-routeros-script/master/grammars/routeros.cson

Potom skonvertuj pomocou npx cson:

npx cson routeros.cson src/grammars/routeros.tmLanguage.json
rm routeros.cson

Alebo použi iný spôsob konverzie — malo by to byť priamočiare.

Načítanie gramatiky v Astro #

Aktualizuj astro.config.mjs:

import { defineConfig } from "astro/config"
import { readFileSync } from "fs"

const routerosGrammar = JSON.parse(
  readFileSync("./src/grammars/routeros.tmLanguage.json", "utf-8")
)

export default defineConfig({
  site: "https://peterbabic.com",
  markdown: {
    shikiConfig: {
      theme: "github-dark",
      langs: [
        {
          ...routerosGrammar,
          aliases: ["routeros"],
        },
      ],
    },
  },
})

Výsledok #

Teraz sa bloky kódu RouterOS vykresľujú so správnym zvýrazňovaním:

/system routerboard mode-button
set enabled=yes on-event=dark-mode

/ip firewall filter
add chain=input action=accept protocol=icmp
add chain=input action=drop

Rovnaký prístup funguje pre akýkoľvek jazyk, ktorý má dostupnú gramatiku pre Atom alebo TextMate, ale nie je zahrnutý v Shiki predvolene. Enjoy!