编写用于CodeMirror的自定义模式，以用于方括号 [英] Writing a custom mode for CodeMirror, for use in Brackets

问题描述

我正在尝试为将处理PowerShell的Brackets编写一个插件/扩展。仔细研究之后，我发现CodeMirror也没有PowerShell模式，因此我需要自己创建它。我度过了一个糟糕的时光，因为几乎没有任何在线详细资源可供我尝试做。

I am trying to write a plugin/extension for Brackets that will handle PowerShell. Well after looking into it, I found that CodeMirror also doesn't have a PowerShell mode, so I need to create it myself. I am having a terrible time because there are hardly any detailed resources online for what I am trying to do.

这是我的 main.js 文件：

    define(function (require, exports, module){
        "use strict";


        //Load Modules
        var LanguageManager = brackets.getModule("language/LanguageManager"),
            CodeMirror = brackets.getModule("thirdparty/CodeMirror2/lib/codemirror"),
            PowerShellMode = require("powershell.js");


        //Define the Language
        LanguageManager.defineLanguage("powershell", {
        name: "PowerShell",
        mode: "powershell",
        fileExtensions: ["ps1"],
        lineComment: ["\/\/"]
        });



        function log(s) {
            console.log("[PS-DevKit] " +s);
        }

        log("PowerShell module loaded!");


    });

这是我的 powershell.js 文件：

//CodeMirror Example
CodeMirror.defineMode("powershell", function() {

    return{
        startStat: function() {return {inString: false};},
        token: function(stream, state){
            //If a string starts here
            if (!state.inString && stream.peek() == '"'){
                stream.next();              //Skip quote
                state.inString = true;      //Update state
            }

            if (state.inString) {

                if (stream.skipTo('"')){    //Quote found on this line
                    stream.next();          //Skip quote
                    state.inString=false;   //Clear flag
                } else {
                    stream.skipToEnd();     //Rest of line is string
                }

                return "red-text";            //Token style

            } else {

                stream.skipTo('"') || stream.skipToEnd();
                return null;                //Unstyled token

            }   
        }  
    };    
});

按原样运行Brackets时，出现一个错误（开发人员控制台），提示它无法加载我的 powershell.js 文件。因此，我尝试输入文件所在的确切路径（位于我的用户目录中的Bracket extensions文件夹），但可以我收到以下消息：

When running Brackets with this code as is, I get an error (developer console) that it could not load my powershell.js file from "Program Files(x86)\Brackets\www". So I tried putting in the exact path to where the file is (the Bracket extensions folder sitting in my User directory), and it worked but I get the following message:

Use brackets.getModule("thirdparty/CodeMirror2/lib/codemirror") instead of global CodeMirror.
    at Object.defineProperty.get (/brackets.js:115:32)
    at file:///C:/Users/MY_USERNAME/AppData/Roaming/Brackets/extensions/user/PS-DevKit/powershell.js:2:1 

有输入吗？日现在，我要尝试做的就是加载它并将引号中的任何文本更改为红色。即使我收到有关需要使用CodeMirror模块的弃用警告，该扩展也会加载，并且如果我创建了 .ps1文件，它会识别出它是PowerShell。

Any input? Right now, all I am trying to do is get it to load and change any text in quotes to red. Even though I get the deprecation warning about needing to use the CodeMirror module, the extension does load, and if I create a ".ps1" file, it recognizes that it is PowerShell.

推荐答案

一般回答-实际上，有 一些对此非常详细的资源：

General answer - there actually are some fairly detailed resources for this:

• 编写CodeMirror模式


• 在括号中定义新的语言-有关如何加载新的CodeMirror模式的信息，请参见自定义CodeMirror模式小节

• Writing a CodeMirror mode
• Defining a new language in Brackets - see the subsection "Custom CodeMirror modes" for how to load your new CodeMirror mode

具体答案-我可以在您的示例代码中发现一些肯定会引起问题的问题：

Specific answer - I can spot a few issues in your sample code that will definitely cause problems:

1. 使用 require（ powershell） 没有 .js-这是JS模块加载程序期望的格式


2. powershell.js应该包含相同的格式 define（...）包装器作为main.js。它应该使用 brackets.getModule（）来获取对CodeMirror的引用，与main.js相同。 （使用Brackets中内置的JSLint，当您引用已忘记显式加载为模块依赖项的全局变量时，警告您很有用。）


3. 您的CM模式有一个错字： code> startStat -> startState


4. 您需要致电在调用 LanguageManager.defineLanguage（）之前，请先使用CodeMirror.defineMode（）-请参阅上面链接的自定义CodeMirror模式文档。您可以在powershell.js模块中或在main.js早期进行此操作。

1. Use require("powershell") without the .js -- this is the format JS module loaders expect
2. powershell.js should contain the same define(...) wrapper as your main.js. And it should use brackets.getModule() to get a reference to CodeMirror, same as main.js. (Using JSLint, which is built into Brackets, is helpful for warning you when you reference globals that you have forgotten to explicitly load as module dependencies).
3. Your CM mode has a typo: startStat -> startState
4. You need to call CodeMirror.defineMode() before calling LanguageManager.defineLanguage() - see "Custom CodeMirror modes" docs linked above. You could either do this in your powershell.js module, or early in main.js.

这篇关于编写用于CodeMirror的自定义模式，以用于方括号的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！