LoginSignup
5
0

More than 3 years have passed since last update.

Ace.jsに予測変換を追加する

Last updated at Posted at 2019-05-21

実行環境

・Electron
Ace.js

Ace.jsはHTML上で動作するエディターを追加するものです
ちょっと独特な感じだけど

Electronじゃない場合は読み込みディレクトリを修正してください。(多分)

スぺニットはこちら

const editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.session.setMode("ace/mode/javascript");
editor.$blockScrolling = Infinity;
editor.setAutoScrollEditorIntoView(true);
editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: true
});
// const beautify = ace.require("ace/ext/beautify"); // get reference to extension
// beautify.beautify(editor.session);
const langTools = ace.require("ace/ext/language_tools");
const words = [
    {"word":"hello"},
    {"word":"word"}
];
const rhymeCompleter = {
    getCompletions: function(editor, session, pos, prefix, callback) {
        callback(null, words.map(function(ea)   {
            return {name: ea.word, value: ea.word, meta: "データ名"}
        }));
    }
}
langTools.addCompleter(rhymeCompleter);

重要な場所はここだけ

const langTools = ace.require("ace/ext/language_tools");
const words = [
    {"word":"hello"},
    {"word":"word"}
];
const rhymeCompleter = {
    getCompletions: function(editor, session, pos, prefix, callback) {
        callback(null, words.map(function(ea)   {
            return {name: ea.word, value: ea.word, meta: "データ名"}
        }));
    }
}
langTools.addCompleter(rhymeCompleter);

これでAce上で

スクリーンショット (305).png

と予測変換追加されました。

GITの質問場で英語で書かれた記事を探しまくってやっと見つけた
英語読めない人にとっては地獄

5
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
0