Writing a custom mode for CodeMirror, for use in Brackets

情到浓时终转凉″ 提交于 2019-12-03 13:37:04

问题


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.



This is my main.js file:

    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!");


    });



This is my powershell.js file:

//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

            }   
        }  
    };    
});



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 



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.


回答1:


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

  • 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. 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.


来源:https://stackoverflow.com/questions/24433552/writing-a-custom-mode-for-codemirror-for-use-in-brackets

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!