emacs で typescript-ts-mode を利用

emacs で typescript-ts-mode を利用する方法のメモ。

emacs 29 から構文解析器の Tree-sitter が標準搭載されているため、Tree-sitter 版の typescript-ts-mode を使用する。

emacs の設定

構文定義ファイルのダウンロード先とモードを指定

.emacs.d/init.el 等に以下を追加。

;; ダウンロード先
(setq treesit-language-source-alist
        '((tsx "https://github.com/tree-sitter/tree-sitter-typescript" "master" "tsx/src")
          (typescript "https://github.com/tree-sitter/tree-sitter-typescript" "master" "typescript/src")))

構文定義ファイルのダウンロード

emacs を起動して、以下を入力。

• M-x treesit-install-language-grammar --> typescript を入力して Enter
• M-x treesit-install-language-grammar --> tsx を入力して Enter

~/.emacs.d/tree-sitter に以下がインストールされる。

~/.emacs.d/tree-sitter

libtree-sitter-typescript.so
libtree-sitter-tsx.so

~/.emacs.d/init.el でモードを設定

(add-to-list 'auto-mode-alist '("\\.ts\\'" . typescript-ts-mode))
(add-to-list 'auto-mode-alist '("\\.tsx\\'" . tsx-ts-mode))

tsx モードの確認

以下で emacs を起動し、TypeScript[TSX] が表示されていることを確認。

emacs -nw test.tsx