加载自定义语言

请先查看所有内建语言。

你可以通过将 TextMate 语法对象传递到 langs 数组中来加载自定义语言。

import {  } from 'shiki'

const  = .(fs.readFileSync('my-lang.json', 'utf8'))

const  = await ({
  : [],
  : ['vitesse-light']
})

const  = .(code, {
  : 'my-lang',
  : 'vitesse-light'
})

同样的，你也可以在高亮器创建后载入自定义语言。

import {  } from 'shiki'

const  = .(fs.readFileSync('my-lang.json', 'utf8'))

const  = await ({
  : [],
  : ['vitesse-light'],
})

await .() // <--

const  = .(code, {
  : 'my-lang',
  : 'vitesse-light'
})

从 v0.14 迁移

自从 1.0 开始，shiki 是与环境无关的，所以我们无法访问文件系统。这意味着 shiki@0.14 中的 path 属性在 1.0 中已经不受支持，你必须手动读取文件并传入对象。

例如，以下代码不会工作：

const highlighter = await createHighlighter({
  langs: [
    {
      name: 'vue-vine',
      scopeName: 'source.vue-vine',
      // ‼️ 这不会工作！
      path: join(__dirname, './vine-ts.tmLanguage.json'),
      embeddedLangs: [
        'vue-html',
        'css',
        'scss',
        'sass',
        'less',
        'stylus',
      ],
    },
  ],
  themes: []
})

所以，请手动加载文件 (通过 fs，import() 或 fetch() 等)：

const vineGrammar = JSON.parse(fs.readFileSync(join(__dirname, './vine-ts.tmLanguage.json'), 'utf8'))

const highlighter = await createHighlighter({
  langs: [
    {
      name: 'vue-vine',
      scopeName: 'source.vue-vine',
      embeddedLangs: [
        'vue-html',
        'css',
        'scss',
        'sass',
        'less',
        'stylus',
      ],
      ...vineGrammar
    },
  ],
  themes: []
})

自定义语言别名

你可以使用 langAlias 选项注册自定义的语言别名。例如：

import {  } from 'shiki'

const  = await ({
  : ['javascript'],
  : { 
    : 'javascript',
  },
  : ['nord']
})

const  = .('const a = 1', {
  : 'mylang', 
  : 'nord'
})