如何在Monaco Editor中根据文件扩展名动态设置语言？

Question

我正在研究monaco编辑器以显示本地代码文件的内容，该文件可能以多种语言编写，因此我想知道如何根据文件扩展名或第一个动态设置/更改monaco编辑器的语言。没有扩展名的文件行（例如＃！/ usr / bin / env python）。

似乎摩纳哥编辑器本身不具备此功能，但是VSCode显然具有此功能。

我想定义一个称为checkLanguage（file_path）的方法，该方法采用文件路径并返回表示monaco-editor支持的语言的字符串。如果无法确定语言，请返回纯文本。

monaco.editor.setModelLanguage(model, checkLanguage(file_path))

支持的语言：https://github.com/microsoft/monaco-languages

Answer 1

我发现了一个有用的npm库，可以根据文件名或内容检测编程语言，并在我的项目中将语言检测实现为：

 var response = await httpClient.GetAsync(ApiBaseAddress).ConfigureAwait(false);

[1]库链接：https://github.com/blakeembrey/node-language-detect

[2]完整代码：https://github.com/Symbolk/SmartCommit/blob/master/src/components/utils/gitutils.js

Answer 2

我只有一个看起来像这样的对象：

fileTypes: {
    css: 'css',
    js: 'javascript',
    json: 'json',
    md: 'markdown',
    mjs: 'javascript',
    ts: 'typescript',
}

创建模型时，我叫monaco.editor.createModel(file.content, fileTypes[file.extension])。显然，您可以扩展列表以包括所需的内容。也许他们会在某个时候添加一个映射，以便您可以仅使用扩展名进行初始化。

根据您的情况，您可以进行monaco.editor.setModelLanguage(model, fileTypes[file_path.split['.'].pop()])。这将涵盖您的文件中包含多个句点的情况，例如test.min.js。

Answer 3

语言已经定义了它们可以处理的文件扩展名，因此可以通过赋予摩纳哥文件名来选择合适的语言：

const model = monaco.editor.createModel(
  value,
  undefined, // language
  monaco.Uri.file(filename) // uri
)

editor.setModel(model)