🐡
エディタのテキストをリアルタイムでDEBUG CONSOLEに出力
趣旨
バロウズはハサミとノリを使ったが、ジョイスは機械支援を受けられなかった。
一方ロシアは鉛筆を使った。
目的
VS Code の拡張を使って、エディタの画面でぽちぽちと文字を打っていくと、DEBUG CONSOLEにぽつぽつと出力されていくものをつくる。
動機
素人がとりあえずやってみたくなっても、手っ取り早いサンプルがあんまりない。
こういうの
つくる
準備はこのへん。
基本的には、
src/extension.ts-
package.json
を書き換えていけばよい。
package.jsonのこのへんを書き換えて、名前の紐付け等を行う。
package.json
"activationEvents": [
"onCommand:busy-echo.echo"
],
"main": "./out/extension.js",
"contributes": {
"commands": [
{
"command": "busy-echo.echo",
"title": "busy echo"
}
]
},
busy-echo.echo という名前のコマンドを、エディタから「busy echo」と言う名前で呼びだす、等の指定
extension.ts にやりたいことを書いていく。
extension.ts
import * as vscode from 'vscode';
//console.log に色をつける
var red = '\u001b[31m';
var green = '\u001b[32m';
var reset = '\u001b[0m';
export function activate(context: vscode.ExtensionContext) {
console.log('"echo" is now active');
let echo = vscode.commands.registerCommand('busy-echo.echo', () => {
let activeEditor = vscode.window.activeTextEditor;
//テキストの変動をキャッチ
vscode.workspace.onDidChangeTextDocument(event => {
if (activeEditor && event.document === activeEditor.document){
//変更があった箇所を表示
for (const change of event.contentChanges){
console.log("変化： " + red + change.text + reset);
}
//全文を表示
let fullText = activeEditor.document.getText();
console.log("全文： " + green + "「" + fullText + "」\n" + reset);
}
});
});
context.subscriptions.push(echo);
}
export function deactivate() {}
VS Codeから呼びだすコマンドを登録し、その中身を書いていく。
- ワークスペースに変動があった場合、
- ワークスペース内のテキストを取得し、
-
console.logに渡す。
変動を onDidChangeTextDocument で拾っているので、
キー入力があるたびに更新される。
ややせわしない。
setTimeOutで一定時間更新を止めるなどのことをしてもよいかもしれない。
let timeId: ReturnType<typeof setTimeout>;
//テキストの変動をキャッチ
vscode.workspace.onDidChangeTextDocument(event => {
clearTimeout(timeId);
let repeater = () => {
if (activeEditor && event.document === activeEditor.document){
//変更があった箇所を表示
for (const change of event.contentChanges){
console.log("変化： " + red + change.text + reset);
}
//全文を表示
let fullText = activeEditor.document.getText();
console.log("全文： " + green + "「" + fullText + "」\n" + reset);
}
};
timeId = setTimeout(repeater, 50);
とりあえずぽつぽつ動く。
コード
参考
Discussion