gpt4 book ai didi

visual-studio-code - 有没有办法使用 tmLanguage 语法来扩展 vscode 集成的 markdown 扩展语法高亮?

转载 作者:行者123 更新时间:2023-12-04 04:06:53 24 4
gpt4 key购买 nike

我正在为 vscode 开发语言扩展。我定义了一个 tmLanguage 文件,一切正常。在悬停功能中,使用 vscode.MarkdownString.appendCodeblock() Markdown 被正确解释,我的自定义语言的语法突出显示开箱即用,通过执行以下操作:

const content = new MarkdownString("", true)
content.appendMarkdown("## Examples: \n")
content.appendCodeblock(examples, "lmps")

在哪里 examples包含一些我的自定义语言的示例代码和 "lmps"是我的语言标识符。
( Example Image Hover)

我想知道是否有办法在 webview 中实现相同的目标。我成功显示了 content在 webview 中,将 markdownString 编译成 html:
async function set_doc_panel_content(panel: DocPanel | undefined, md_content: vscode.MarkdownString) {
const html: string = await vscode.commands.executeCommand('markdown.api.render', md_content.value) as string;
panel!.webview.html = html;
}

到目前为止一切都很好,但是通过这种方式,markdown 不知道我的自定义语言,也不做任何语法高亮。 ( Example image Webview ) 现在,我了解到可以通过在激活函数中返回一个对象来贡献一个 markdown-it 插件,从而为 Markdown 扩展添加语言支持。
export function activate(context: vscode.ExtensionContext) {

...

return {
extendMarkdownIt(md: any) {
return md.use(require('markdown-it-emoji'));
}
}

但是,如果我没看错的话,这实际上需要开发一个专用的 markdown-it 插件。我想知道是否有更简单的方法可以将我的语言集成到 markdown api 中。因为 vscode 显然已经可以在悬停和完成建议中原生地做到这一点。我可以在 webview 中以某种方式使用此功能吗?或者,有没有一种方法可以从 tmLanguage 文件生成 markdown-it 插件,而无需深入学习 markdown-it 插件开发?也许有人有指向完成类似事情的项目的指针?

最佳答案

对于任何有同样问题的人:
似乎没有一个 super 简单的方法。我为这项工作找到的最容易使用的软件包是 highlights .然而,这个包(和其他像 first-mate 的包)依赖于原生模块 Oniguruma .该软件包需要针对特定​​版本的 Electron 进行编译。这使得向市场发布 vscode 扩展变得非常困难,因为 vscode 不允许在包安装中运行此编译。
我发现的一个解决方案是为 markdown-it 提供一个突出显示功能。
vscode-textmate 可以阅读 .plist 或 .tmLanguage 的语法例如。此软件包可与 vscode-oniguruma 一起使用.这里的技巧是加载 WASM 以使其工作:

const oniguruma = require('vscode-oniguruma')
const oniguruma_root: string = path.join(env.appRoot, 'node_modules.asar', 'vscode-oniguruma')
const wasm = readFileSync(path.join(oniguruma_root, 'release', 'onig.wasm')).buffer;
const on_wasm = oniguruma.loadWASM(wasm);
然后可以这样做:
const registry = new vsctm.Registry({
onigLib: Promise.resolve({
createOnigScanner: (sources) => new oniguruma.OnigScanner(sources),
createOnigString: (str) => new oniguruma.OnigString(str)
}),
loadGrammar: () => {
return readJSON2plist(path.join(context.extensionPath, 'syntaxes', 'lmps.tmLanguage.json'))
.then(data => {
return vsctm.parseRawGrammar(data)
}).catch(null)
}
});

const grammar = await registry.loadGrammar('source.lmps')

const md = require('markdown-it')(
{
html: true,
linkify: true,
typographer: true,
langPrefix: '',
highlight: function (str: string, lang: string) {
if (grammar && lang && lang == 'lmps') {
return tokenize_lmps(str, grammar)
}
}
});
return md
md然后可以用于渲染 Markdown 内容:
let html = md.render(md_string)
可以找到一个有效的实现 here

关于visual-studio-code - 有没有办法使用 tmLanguage 语法来扩展 vscode 集成的 markdown 扩展语法高亮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62328182/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com