VSCodeの拡張機能を作るときにCannot find module 'vscode'となった

参考記事：かんたん！VS Code拡張機能開発 | DevelopersIO

環境

• 2024年04月
• macOS14.4.1（23E224）Sonoma
• Visual Studio Code 1.88.0

手順

コードgeneratorをインストールする

npm install -g  yo genarete-code

雛形作成する

yo code

TypeScriptで、あとはデフォルトyarnを選択。

cd <project name>

code ./

VSCode上で試しに実行する

写真の下側のRunExtensionをクリックすると、別windowが開いて、デバッグできる。 (左のサイドバーのデバッグアイコンを押してもよい）

type error

エラー無視しても大丈夫らしいが、その前にエラーをみる

エラー見る

モジュール 'vscode' またはそれに対応する型宣言が見つかりません。

yarn add @types/vscode --dev

でもだめっぽい。

うざいので、とりあえずignoreする。

// @ts-ignore
import * as vscode from 'vscode';

command + shift + Pでコマンド探しモードに入り、helloと入力すると初期のコマンド出てくる。

hello world command exists in vscode prompt

実行すると下記エラーが出た。

Activating extension 'undefined_publisher.vscode-winresizer' failed: Cannot find module '/Users/user/dev/2024/products/vscode-winresizer/out/extension.js'
Require stack:
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-amd.js
- /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-fork.js.

コンパイルしていないので、out/にソースコードがないため発生しているっぽい？

トランスパイル実行コマンドは、packge.jsonに載っていると思うので、見ると、vscode:prepublishすると良さそうなので、実行する。

yarn run vscode:prepublish

エラー

moduleがないよというエラーが出る。

yarn run vscode:prepublish
src/extension.ts:3:25 - error TS2307: Cannot find module 'vscode' or its corresponding type declarations.

3 import * as vscode from 'vscode';
                          ~~~~~~~~

src/test/extension.test.ts:1:25 - error TS2307: Cannot find module 'assert' or its corresponding type declarations.

1 import * as assert from 'assert';
                          ~~~~~~~~

src/test/extension.test.ts:5:25 - error TS2307: Cannot find module 'vscode' or its corresponding type declarations.

5 import * as vscode from 'vscode';
                          ~~~~~~~~

src/test/extension.test.ts:8:1 - error TS2582: Cannot find name 'suite'. Do you need to install type definitions for a test runner? Try `npm i --save-dev @types/jest` or `npm i --save-dev @types/mocha`.

8 suite('Extension Test Suite', () => {
  ~~~~~

src/test/extension.test.ts:11:2 - error TS2582: Cannot find name 'test'. Do you need to install type definitions for a test runner? Try `npm i --save-dev @types/jest` or `npm i --save-dev @types/mocha`.

11  test('Sample test', () => {
    ~~~~


Found 5 errors in 2 files.

Errors  Files
     1  src/extension.ts:3
     4  src/test/extension.test.ts:1
u

面倒くさいなと思ったのでissueを確認

github.com

同じ目に合っている人がいた。

というわけで、rmして、npmを使うようにしたら治った。

vscodeを再起動して、ちゃんとproject入り直し、デバッグアイコンから拡張機能開発ホストを起動した。

hello world