Question

我很难让Codemirror在混合模式下将正确的自动缩进应用于内部模式。

您可以在此处查看该模式的实时版本（及其运行方式）： https://extremely-alpha.iodide.io/notebooks/216/，但总而言之，想法是能够使用matlab样式块定界符在以下语言之间进行切换：

%% js
[1,2,3].forEach(i => {
  console.log(i)
})

%% py
for i in range(5):
    for j in range(10):
        print i+j

%% css
div#foo {
    border: 1px solid pink
}

从我的示例链接中可以看到，语法突出显示可以正常工作，但是您还会注意到缩进不能按需工作。

此代码镜像模式的代码为here on github。它很大程度上基于codemirror's html mixed mode。

我再次尝试将copyState添加到我的代码中，再次遵循html混合模式-

copyState: state => {
    let local;
    if (state.localState) {
      console.log("state.localState copied");
      local = CodeMirror.copyState(state.localMode, state.localState);
    }
    return {
      token: state.token,
      localMode: state.localMode,
      localState: local
    };
  },

-但这导致了另一种奇怪的压痕行为，并且最终无法正常工作。

我已经为此花了很长时间，而且我还无法通过google，api文档和论坛将其组合在一起，因此，任何帮助将不胜感激！谢谢！

Answer 1

以防将来有人遇到此问题：事实证明，代码镜像模式通常不会内置明智的默认值，或者至少在您使用CodeMirror.getMode(...)时不会默认加载它们。就我而言，我不得不从

const innerModes = {
  js: CodeMirror.getMode({}, { name: "javascript" }),
  py: CodeMirror.getMode({}, { name: "python" }),
  md: CodeMirror.getMode({}, { name: "markdown" }),
  css: CodeMirror.getMode({}, { name: "css" }),
  raw: CodeMirror.getMode({}, { name: "text/plain" }),
  fetch: CodeMirror.getMode({}, { name: "fetch" })
};

收件人：

const innerModes = {
  js: CodeMirror.getMode(
    { indentUnit: 2, statementIndent: 2 },
    { name: "javascript" }
  ),
  py: CodeMirror.getMode(
    { indentUnit: 4, hangingIndent: 4 },
    { name: "python" }
  ),
  md: CodeMirror.getMode({}, { name: "markdown" }),
  css: CodeMirror.getMode({ indentUnit: 2 }, { name: "css" }),
  raw: CodeMirror.getMode({}, { name: "text/plain" }),
  fetch: CodeMirror.getMode({}, { name: "fetch" })
};

这可以防止NaN脱离子模式的缩进功能。

Codemirror内部模式自动缩进问题

1 个答案: