## 経緯
半年前くらいに一度[[TypeScript 7]]のPreviewを試したことがある。
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/favicon-64.png" />
<span class="link-card-v2-site-name">Minerva</span>
</div>
<div class="link-card-v2-title">
📜2025-05-25 TypeScript Native Previewsを試す
</div>
<div class="link-card-v2-content">TypeScriptのGo移植版「tsgo」プレビューがnpmとVSCode拡張で公開された経緯から、既存プロジェクトで導入・型チェック・エラー修正・パフォーマンス比較を実施した。strictBuiltInIteratorReturnや相対パスのインポート対応などの課題を経て、型チェック速度が約10倍向上した結果を得た。VSCode拡張の設定方法や今後の活用方針にも触れた。</div>
<img class="link-card-v2-image" src="https://publish-01.obsidian.md/access/35d05cd1bf5cc500e11cc8ba57daaf88/Notes/attachments/activity.webp" />
<a data-href="📜2025-05-25 TypeScript Native Previewsを試す" class="internal-link"></a>
</div>
%%[[📜2025-05-25 TypeScript Native Previewsを試す]]%%
当時の結論は以下になった。
- [[🦉Various Complements]]は動いた
- [[Nuxt]]のプロジェクトでは試していない
- [[Neovim]]で動くかは試していない
### Microsoft Dev Blogsの更新
[[TypeScript 7]]についての進捗報告があった。
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://devblogs.microsoft.com/typescript/wp-content/uploads/sites/11/2018/10/Microsoft-Favicon.png" />
<span class="link-card-v2-site-name">TypeScript</span>
</div>
<div class="link-card-v2-title">
Progress on TypeScript 7 - December 2025 - TypeScript
</div>
<div class="link-card-v2-content">
Earlier this year, the TypeScript team announced that we’ve been porting the compiler and language service to na ...
</div>
<img class="link-card-v2-image" src="https://devblogs.microsoft.com/typescript/wp-content/uploads/sites/11/2018/08/typescriptfeature.png" />
<a href="https://devblogs.microsoft.com/typescript/progress-on-typescript-7-december-2025/"></a>
</div>
普段 [[tsc]] を使っていて一番ボトルネックになるのは型チェックの遅さなので、[[tsgo]]を導入する場合の優先順位としては以下になる。
1. [[Nuxt]]のプロジェクトで型チェックに利用する ([[Neovim]]は[[tsc]]のままでもよい)
2. [[Neovim]]で[[tsgo]]を動かす
ただ、興味は以下の順なのでこのように調査していく。
1. [[Neovim]]で[[tsgo]]を動かす
2. [[Nuxt]]のプロジェクトで型チェックに利用する ([[Neovim]]は[[tsc]]のままでもよい)
## [[Neovim]]で[[tsgo]]を動かす
### プロジェクトセットアップ
[[pnpm]]のプロジェクトをセットアップする。
```js
// 環境
"devDependencies": {
"@biomejs/biome": "2.3.7",
"@tsconfig/recommended": "1.0.13",
"@types/node": "24.10.1",
"tsx": "4.20.6",
"typescript": "5.9.3"
}
```
[[TypeScript 7]]をインストール。
```console
$ pnpm add -D @typescript/native-preview
...
devDependencies:
+ @typescript/native-preview 7.0.0-dev.20251126.1 (7.0.0-dev.20251203.1 is available)
...
```
### [[Neovim]]の[[LSP]]設定
[[nvim-lspconfig]]に[[tsgo]]のセクションがあった。
<div class="link-card-v2">
<div class="link-card-v2-site">
<img class="link-card-v2-site-icon" src="https://github.githubassets.com/favicons/favicon.svg" />
<span class="link-card-v2-site-name">GitHub</span>
</div>
<div class="link-card-v2-title">
nvim-lspconfig/doc/configs.md at master · neovim/nvim-lspconfig
</div>
<div class="link-card-v2-content">
Quickstart configs for Nvim LSP. Contribute to neovim/nvim-lspconfig development by creating an account on GitHu ...
</div>
<img class="link-card-v2-image" src="https://opengraph.githubassets.com/30ac84858dccc11ee071891b8030ba2eaac32bc6f3ad40a900eabfa03599bc32/neovim/nvim-lspconfig" />
<a href="https://github.com/neovim/nvim-lspconfig/blob/master/doc/configs.md#tsgo"></a>
</div>
#2025/12/04 時点ではこんな感じだった。
> [!code]- nvim-lspconfig/lsp /tsgo.lua
> ```ts
> ---@brief
> ---
> --- https://github.com/microsoft/typescript-go
> ---
> --- `typescript-go` is experimental port of the TypeScript compiler (tsc) and language server (tsserver) to the Go programming language.
> ---
> --- `tsgo` can be installed via npm `npm install @typescript/native-preview`.
> ---
> --- ### Monorepo support
> ---
> --- `tsgo` supports monorepos by default. It will automatically find the `tsconfig.json` or `jsconfig.json` corresponding to the package you are working on.
> --- This works without the need of spawning multiple instances of `tsgo`, saving memory.
> ---
> --- It is recommended to use the same version of TypeScript in all packages, and therefore have it available in your workspace root. The location of the TypeScript binary will be determined automatically, but only once.
> ---
>
> ---@type vim.lsp.Config
> return {
> cmd = { 'tsgo', '--lsp', '--stdio' },
> filetypes = {
> 'javascript',
> 'javascriptreact',
> 'javascript.jsx',
> 'typescript',
> 'typescriptreact',
> 'typescript.tsx',
> },
> root_dir = function(bufnr, on_dir)
> -- The project root is where the LSP can be started from
> -- As stated in the documentation above, this LSP supports monorepos and simple projects.
> -- We select then from the project root, which is identified by the presence of a package
> -- manager lock file.
> local root_markers = { 'package-lock.json', 'yarn.lock', 'pnpm-lock.yaml', 'bun.lockb', 'bun.lock' }
> -- Give the root markers equal priority by wrapping them in a table
> root_markers = vim.fn.has('nvim-0.11.3') == 1 and { root_markers, { '.git' } }
> or vim.list_extend(root_markers, { '.git' })
>
> -- exclude deno
> if vim.fs.root(bufnr, { 'deno.json', 'deno.jsonc', 'deno.lock' }) then
> return
> end
>
> -- We fallback to the current working directory if no project root is found
> local project_root = vim.fs.root(bufnr, root_markers) or vim.fn.getcwd()
>
> on_dir(project_root)
> end,
> }
> ```
`tsgo.lua` を追加。
`nvim/after/lsp/tsgo.lua`
```lua
return {}
```
[[vtsls]]の代わりに有効にする。
`nvim/lua/lsp.lua`
```diff
if not vim.g.vscode then
vim.lsp.enable({
"bashls",
"biome",
"cssls",
"denols",
"emmet_language_server",
"eslint",
"golangci_lint_ls",
"gopls",
"html",
"jsonls",
"lua_ls",
"pyright",
"ruff",
"rust_analyzer",
"sqls",
"svelte",
"tailwindcss",
+ "tsgo"
- "vtsls",
"vue_ls",
"yamlls",
})
end
```
無効化した[[vtsls]]の設定は以下。
> [!code]- nvim/after/lsp/vtsls.lua
> ```lua
> local vue_language_server_path = os.getenv("HOME")
> .. "/.local/share/mise/installs/npm-vue-language-server/latest/lib/node_modules/@vue/language-server"
> local vue_plugin = {
> name = "@vue/typescript-plugin",
> location = vue_language_server_path,
> languages = { "vue" },
> configNamespace = "typescript",
> }
>
> return {
> workspace_required = true,
> root_dir = function(bufnr, on_dir)
> local root_markers = { "package.json", "tsconfig.json", "jsconfig.json" }
> local project_root = vim.fs.root(bufnr, root_markers)
> on_dir(project_root)
> end,
> settings = {
> vtsls = {
> tsserver = {
> globalPlugins = {
> vue_plugin,
> },
> },
> },
> },
> filetypes = { "typescript", "javascript", "javascriptreact", "typescriptreact", "vue" },
> }
> ```
tsファイルを開いても起動しない。`:LspInfo` を実行すると以下の警告が出ている。
```warning
- ⚠️ WARNING 'tsgo' is not executable. Configuration will not be used.
```
### グローバルインストール
よく考えたら[[Language Server]]はグローバルにインストールしないといけなかった。`tsgo` が解決しないし、[[Language Server]]以外の部分でlocalの[[tsgo]]が使われるのであれば問題ない。
```console
mise use -g npm:@typescript/native-preview
```
### 気になる点
[[vtsls]]との違い。
- Code Actionがほとんど発生しない
- 個人的に必要なものは表示されているので問題ではないが
- ファイルを新規追加したとき、それを補完することができない
- [[vtsls]]は即座に補完可能になる
- [[Diagnostic (Neovim)|Diagnostic]]も即座
- これは体験に結構影響与えるので厳しいかも
[[Neovim]]で使うにはまだキツそうなので様子見。
## [[Nuxt]]プロジェクトで動かす
[[Nuxt4]]のプロジェクトで、コマンドとして動かしてみる。
[[Nuxt4]]プロジェクトの新規作成は省略。[[Bun]]を使ったものとする。[[TypeScript 7]]をインストール。
```console
bun add -D @typescript/native-preview
```
[[Nuxt]]の場合、`nuxt typecheck` で [[vue-tsc]] を使うから、そちらが[[tsgo]]対応してないとだめそう。
> [!fixme]
> - [ ] [[vue-tsc]]と[[tsgo]]まわりの可視化だけやっておきたい
> - [ ] [[TypeScriptのLSPとNeovim周りの関係]]