使用Theia——添加语言支持

时间:2020-01-07 Jaxu 人气:0

上一篇：使用Theia——创建插件

Theia——添加语言支持

Theia中TextMate的支持

　　使用TextMate语法可以为大部分源文件提供精准的着色修饰，虽然这只是在语法级别上（没有语言本身的深度解析）。语义着色可以由语言服务器提供。

　　TextMate语法主要有两种格式：.plist和.tmLanguage.json，这两种Theia都支持。

　　更多有关TextMate语法的内容可以查看这里。

　　注意：特定语言的语法应该包含在该语言的专用扩展包中。@theia/textmate-grammars中只注册了当前没有任何特定扩展包的语言。

添加新语法

　　要提供一种新语法，通常的做法是在扩展包的根目录下创建一个data目录，在其中保存不同的语法。

extension/
    data/
        grammars go here
    lib/
        ...
    src/
        ...
    package.json
    ...

　　然后，在package.json文件中声明以下属性，这样新提供的语法可以与源代码和编译的文件一同发布。

"files": [
    "data",
    "lib",
    "src"
  ],

　　在扩展包中，我们可以通过LanguageGrammarDefinitionContribution的contribution point来提供这一特性。

@injectable()
export class YourContribution implements LanguageGrammarDefinitionContribution {

    readonly id = 'languageId';
    readonly scopeName = 'source.yourLanguage';

    registerTextmateLanguage(registry: TextmateRegisty) {
        registry.registerTextmateGrammarScope(this.scopeName, {
            async getGrammarDefinition() {
                return {
                    format: 'json',
                    content: require('..https://img.qb5200.com/download-x/data/yourGrammar.tmLanguage.json'),
                }
            }
        });
        registry.mapLanguageIdToTextmateGrammar(this.id, this.scopeName);
    }
}

　　如果使用.plist语法，则不能使用require来直接获取内容，因为Webpack将返回从服务器获取的文件的名称。这种情况下，可以使用下面的模式来获取文件的内容：

@injectable()
export class YourContribution implements LanguageGrammarDefinitionContribution {

    readonly id = 'languageId';
    readonly scopeName = 'source.yourLanguage';

    registerTextmateLanguage(registry: TextmateRegisty) {
        registry.registerTextmateGrammarScope(this.scopeName, {
            async getGrammarDefinition() {
                const response = await fetch(require('..https://img.qb5200.com/download-x/data/yourGrammar.plist'));
                return {
                    format: 'plist',
                    content: await response.text(),
                }
            }
        });
        registry.mapLanguageIdToTextmateGrammar(this.id, this.scopeName);
    }
}

原文地址：https://theia-ide.orghttps://img.qb5200.com/download-x/docs/textmate

加载全部内容