浏览器中的JavaScript代码编辑器，语法突出显示支持Smarty模板标记？

我在互联网站上到处搜索，发现了一些非常棒的语法高亮显示和缩进等等。。。但似乎还没有人支持模板标记

一个新的Smarty模式将是最好的，但如果需要，我将使用不同的编辑器

我确实发现。。。但它非常简单，我仍然希望支持混合HTML/CSS/JS高亮显示，比如CodeMirror的PHP模式

我只是想在开始使用我自己的CodeMirror模式之前，我会先和SO hive mind核实一下。如果我真的做了一个新的模式（并得到任何地方），我会把它张贴在这里

---

谢谢

这可能会有所帮助。这个周末我为CodeMirror2写了一个Smarty模式。见：

我也在这里更改了CodeMirror项目：

祝你一切顺利-

本

---

[编辑：这是主脚本的一部分。我将很快添加Smarty/HTML/CSS/JS模式]。

这可能会有所帮助。这个周末我为CodeMirror2写了一个Smarty模式。见：

我也在这里更改了CodeMirror项目：

祝你一切顺利-

本

---

[编辑：这是主脚本的一部分。我将很快添加Smarty/HTML/CSS/JS模式]。

我尝试了一些与Smarty的混合模式，虽然我的工作并不完美，但到目前为止，它对我来说已经足够好了。我从de htmlmixedmode开始添加smarty模式：

  CodeMirror.defineMode("smartymixed", function(config, parserConfig) {
  var htmlMode = CodeMirror.getMode(config, {name: "xml", htmlMode: true});
  var smartyMode = CodeMirror.getMode(config, "smarty");
  var jsMode = CodeMirror.getMode(config, "javascript");
  var cssMode = CodeMirror.getMode(config, "css");



  function html(stream, state) {
    var style = htmlMode.token(stream, state.htmlState);
    if (style == "tag" && stream.current() == ">" && state.htmlState.context) {
      if (/^script$/i.test(state.htmlState.context.tagName)) {
        state.token = javascript;
        state.localState = jsMode.startState(htmlMode.indent(state.htmlState, ""));
        state.mode = "javascript";
      }
      else if (/^style$/i.test(state.htmlState.context.tagName)) {
        state.token = css;
        state.localState = cssMode.startState(htmlMode.indent(state.htmlState, ""));
        state.mode = "css";
      }
    }

    return style;
  }
  function maybeBackup(stream, pat, style) {
    var cur = stream.current();
    var close = cur.search(pat);
    if (close > -1) stream.backUp(cur.length - close);
    return style;
  }
  function javascript(stream, state) {
    if (stream.match(/^<\/\s*script\s*>/i, false)) {
      state.token = html;
      state.localState = null;
      state.mode = "html";
      return html(stream, state);
    }
    return maybeBackup(stream, /<\/\s*script\s*>/,
                       jsMode.token(stream, state.localState));
  }
  function css(stream, state) {
    if (stream.match(/^<\/\s*style\s*>/i, false)) {
      state.token = html;
      state.localState = null;
      state.mode = "html";
      return html(stream, state);
    }
    return maybeBackup(stream, /<\/\s*style\s*>/,
                       cssMode.token(stream, state.localState));
  }

  function smarty(stream, state) {
     style =  smartyMode.token(stream, state.localState);
     if ( state.localState.tokenize == null ) 
          { // back to anything from smarty
          state.token = state.htmlState.tokens.pop();
          state.mode = state.htmlState.modes.pop();
          state.localState = state.htmlState.states.pop(); // state.htmlState;
          }
      return(style);
      }

  return {

    startState: function() {
      var state = htmlMode.startState();
      state.modes = [];
      state.tokens = [];
      state.states = [];
      return {token: html, localState: null, mode: "html", htmlState: state};
    },

    copyState: function(state) { 
      if (state.localState)
        var local = CodeMirror.copyState( 
            ( state.token == css ) ? cssMode : (( state.token == javascript ) ? jsMode : smartyMode ), 
            state.localState);
      return {token: state.token, localState: local, mode: state.mode,
              htmlState: CodeMirror.copyState(htmlMode, state.htmlState)};
    },

    token: function(stream, state) {

      if ( stream.match(/^{[^ ]{1}/,false) )
          { // leaving anything to smarty
          state.htmlState.states.push(state.localState);
          state.htmlState.tokens.push(state.token);
          state.htmlState.modes.push(state.mode);
          state.token = smarty;
              state.localState = smartyMode.startState();
              state.mode = "smarty";
          }

      return state.token(stream, state);
    },


    compareStates: function(a, b) {
      if (a.mode != b.mode) return false;
      if (a.localState) return CodeMirror.Pass;
      return htmlMode.compareStates(a.htmlState, b.htmlState);
    },

    electricChars: "/{}:"
  }
}, "xml", "javascript", "css", "smarty");

CodeMirror.defineMIME("text/html", "smartymixed");

codemirr.defineMode（“smartymixed”），函数（config，parserConfig）{
var htmlMode=codemirr.getMode（配置，{name:“xml”，htmlMode:true}）；
var smartyMode=codemirr.getMode（配置，“smarty”）；
var jsMode=codemirr.getMode（配置，“javascript”）；
var cssMode=CodeMirror.getMode（配置，“css”）；
函数html（流、状态）{
var style=htmlMode.token（stream，state.htmlState）；
if（style==“tag”&&stream.current（）==“>”&&state.htmlState.context）{
if（/^script$/i.test（state.htmlState.context.tagName））{
state.token=javascript；
state.localState=jsMode.startState（htmlMode.indent（state.htmlState，“”）；
state.mode=“javascript”；
}
else if（/^style$/i.test（state.htmlState.context.tagName））{
state.token=css；
state.localState=cssMode.startState（htmlMode.indent（state.htmlState，“”）；
state.mode=“css”；
}
}
回归风格；
}
功能可能是备份（流、pat、样式）{
var cur=stream.current（）；
var close=当前搜索（pat）；
如果（关闭>-1）流备份（当前长度-关闭）；
回归风格；
}
函数javascript（流、状态）{
if（stream.match（/^/i，false））{
state.token=html；
state.localState=null；
state.mode=“html”；
返回html（流、状态）；
}
返回maybebebackup（流，//，
令牌（stream，state.localState））；
}
函数css（流、状态）{
if（stream.match（/^/i，false））{
state.token=html；
state.localState=null；
state.mode=“html”；
返回html（流、状态）；
}
返回maybebebackup（流，//，
令牌（stream、state.localState））；
}
函数smarty（流、状态）{
style=smartyMode.token（stream、state.localState）；
if（state.localState.tokenize==null）
{//回到smarty的任何内容
state.token=state.htmlState.tokens.pop（）；
state.mode=state.htmlState.modes.pop（）；
state.localState=state.htmlState.states.pop（）；//state.htmlState；
}
回归（风格）；
}
返回{
startState:函数（）{
var state=htmlMode.startState（）；
state.modes=[]；
state.tokens=[]；
state.states=[]；
返回{token:html，localState:null，mode:“html”，htmlState:state}；
},
copyState:函数（状态）{
if（state.localState）
var local=CodeMirror.copyState（
（state.token==css）？cssMode:（（state.token==javascript）？jsMode:smartyMode），
state.localState）；
返回{token:state.token，localState:local，mode:state.mode，
htmlState:codemirr.copyState（htmlMode，state.htmlState）}；
},
令牌：函数（流、状态）{
if（stream.match（/^{[^]{1}/，false））
{//把任何东西留给smarty
state.htmlState.states.push（state.localState）；
state.htmlState.tokens.push（state.token）；
state.htmlState.modes.push（state.mode）；
state.token=smarty；
state.localState=smartyMode.startState（）；
state.mode=“smarty”；
}
返回状态。令牌（流、状态）；
},
比较地产：功能（a、b）{
如果（a.mode！=b.mode）返回false；
if（a.localState）返回CodeMirror.Pass；
返回htmlMode.compareStates（a.htmlState，b.htmlState）；
},
电子字符：“/{}”：
}
}“xml”、“javascript”、“css”、“smarty”）；
defineMIME（“text/html”、“smartymixed”）；

仅在令牌功能中切换到smarty模式，但。。。

---

您还必须修补其他基本模式（css、javascript和xml）以在{字符上停止它们，这样您就可以退回到令牌函数中，根据regexp（{后跟一个非空字符）对其进行测试.

我尝试了一些与smarty的混合模式，虽然我的工作并不完美，但到目前为止，它对我来说已经足够好了。我从de-htmlmixedmode开始添加smarty模式：

  CodeMirror.defineMode("smartymixed", function(config, parserConfig) {
  var htmlMode = CodeMirror.getMode(config, {name: "xml", htmlMode: true});
  var smartyMode = CodeMirror.getMode(config, "smarty");
  var jsMode = CodeMirror.getMode(config, "javascript");
  var cssMode = CodeMirror.getMode(config, "css");



  function html(stream, state) {
    var style = htmlMode.token(stream, state.htmlState);
    if (style == "tag" && stream.current() == ">" && state.htmlState.context) {
      if (/^script$/i.test(state.htmlState.context.tagName)) {
        state.token = javascript;
        state.localState = jsMode.startState(htmlMode.indent(state.htmlState, ""));
        state.mode = "javascript";
      }
      else if (/^style$/i.test(state.htmlState.context.tagName)) {
        state.token = css;
        state.localState = cssMode.startState(htmlMode.indent(state.htmlState, ""));
        state.mode = "css";
      }
    }

    return style;
  }
  function maybeBackup(stream, pat, style) {
    var cur = stream.current();
    var close = cur.search(pat);
    if (close > -1) stream.backUp(cur.length - close);
    return style;
  }
  function javascript(stream, state) {
    if (stream.match(/^<\/\s*script\s*>/i, false)) {
      state.token = html;
      state.localState = null;
      state.mode = "html";
      return html(stream, state);
    }
    return maybeBackup(stream, /<\/\s*script\s*>/,
                       jsMode.token(stream, state.localState));
  }
  function css(stream, state) {
    if (stream.match(/^<\/\s*style\s*>/i, false)) {
      state.token = html;
      state.localState = null;
      state.mode = "html";
      return html(stream, state);
    }
    return maybeBackup(stream, /<\/\s*style\s*>/,
                       cssMode.token(stream, state.localState));
  }

  function smarty(stream, state) {
     style =  smartyMode.token(stream, state.localState);
     if ( state.localState.tokenize == null ) 
          { // back to anything from smarty
          state.token = state.htmlState.tokens.pop();
          state.mode = state.htmlState.modes.pop();
          state.localState = state.htmlState.states.pop(); // state.htmlState;
          }
      return(style);
      }

  return {

    startState: function() {
      var state = htmlMode.startState();
      state.modes = [];
      state.tokens = [];
      state.states = [];
      return {token: html, localState: null, mode: "html", htmlState: state};
    },

    copyState: function(state) { 
      if (state.localState)
        var local = CodeMirror.copyState( 
            ( state.token == css ) ? cssMode : (( state.token == javascript ) ? jsMode : smartyMode ), 
            state.localState);
      return {token: state.token, localState: local, mode: state.mode,
              htmlState: CodeMirror.copyState(htmlMode, state.htmlState)};
    },

    token: function(stream, state) {

      if ( stream.match(/^{[^ ]{1}/,false) )
          { // leaving anything to smarty
          state.htmlState.states.push(state.localState);
          state.htmlState.tokens.push(state.token);
          state.htmlState.modes.push(state.mode);
          state.token = smarty;
              state.localState = smartyMode.startState();
              state.mode = "smarty";
          }

      return state.token(stream, state);
    },


    compareStates: function(a, b) {
      if (a.mode != b.mode) return false;
      if (a.localState) return CodeMirror.Pass;
      return htmlMode.compareStates(a.htmlState, b.htmlState);
    },

    electricChars: "/{}:"
  }
}, "xml", "javascript", "css", "smarty");

CodeMirror.defineMIME("text/html", "smartymixed");

codemirr.defineMode（“smartymixed”），函数（config，parserConfig）{
var htmlMode=codemirr.getMode（配置，{name:“xml”，htmlMode:true}）；
var smartyMode=codemirr.getMode（配置，“smarty”）；
var jsMode=codemirr.getMode（配置，“javascript”）；
var cssMode=CodeMirror.getMode（配置，“css”）；
函数html（流、状态）{
var style=htmlMode.token（stream，state.htmlState）；
if（style==“tag”&&stream.current（）==“>”&&state.htmlS