Ghost 中文输入 BUG 篇

解决 Ghost 部落平台的中文输入 bug。当我安装 Ghost 博客平台后,发现既然中文输入有不显示的问题,明显的并不是因为中文显示的问题,因为如果在段落的第一个字输入英字(关掉拼音输入法的情况),接下来都不会有中文输入的问题,一直到下一行文字输入为止。

搜索之下,发现原来这问题从 Ghost 2.0 时代就有了,但是 Ghost 团队还是没修复,幸好 Ghost 在中文圈还算小有名气,中文圈的开发者也做好应对之道。

事前准备工具

如果是在 Digital Ocean 的一键安装 Ghost 的话可以在 var/www/ghos/version/3.1/core/build/assets 里的 vendor.min-xxxx.js 中搜索 {key:"keydown",value:function(e){...}}代码块 (我们可以上下文搜索 isHorizontalArrowWithoutModifiersOtherThanShift 字符);

找到 {key:"keydown",value:function(e)将之替换记得只是将代码块中的代码换掉,千万别将其他代码修改。

大约是在 6237 行代码找到

{key:"keydown",value:function(event) {

  let { editor } = this;
  if (!editor.hasCursor()) { return; }
  if (!editor.isEditable) { return; }

  // let key = Key.fromEvent(event);
  let key = r.default.fromEvent(event)
  this._updateModifiersFromKey(key, {isDown:true});

  if (editor.handleKeyCommand(event)) { return; }

  if (editor.post.isBlank) {
    editor._insertEmptyMarkupSectionAtCursor();
  }

  let range = editor.range;
  let isAfterDelete = false;

  switch(true) {
    case key.isIME(): {
      if (range && range.head.offset === 0) {
        this._textInputHandler.handle(key.toString());
      }
      event.preventDefault();
      break;
    }
    // FIXME This should be restricted to only card/atom boundaries
    case key.isHorizontalArrowWithoutModifiersOtherThanShift(): {
      let newRange;
      if (key.isShift()) {
        newRange = range.extend(key.direction * 1);
      } else {
        newRange = range.move(key.direction);
      }

      editor.selectRange(newRange);
      event.preventDefault();
      break;
    }
    case key.isDelete(): {
      let { direction } = key;
      let unit = 'char';
      if(s.default.isMac() && key.metaKey) {
        unit = 'line';
        editor.performDelete({direction, unit});
        break;
      } else if (key.altKey && s.default.isMac()) {
        unit = 'word';
      } else if (key.ctrlKey && !s.default.isMac()) {
        unit = 'word';
      }
      editor.performDelete({direction, unit});
      event.preventDefault();
      break;
    }
    case key.isEnter():
      this._textInputHandler.handleNewLine();
      editor.handleNewline(event);
      break;
    case key.isTab():
      // Handle tab here because it does not fire a `keypress` event
      event.preventDefault();
      this._textInputHandler.handle(key.toString());
      break;
  }

}}

最后

完成后,登入后台就会发现问题解决了。

对 Digital Ocean 有兴趣可点击我的链接,将可获得 USD100 Digital Ocean 的余额:https://m.do.co/c/1b223479fa8c

来源:https://cloud.tencent.com/developer/article/1587384
来源:https://github.com/soulteary/youling
来源:http://blog.workos.top/ghost-post/

Default image
yong13579