VSCodeでDeno開発する前の準備
Node.jsの後継としてじわじわ勢力拡大中(?)のDenoですが、VSCodeで作業する際に少し準備が必要です。でもこの作業って、VSCodeを結構使い込んでないとわからないよな… と思ったので、ついでにまとめときました。
拡張機能インストール
VSCodeで新たな言語, FW等に手を出す時のルーティーン。
拡張機能の名前はそのまま「Deno」。
インストール。これで基本的な補完とかはいけ……
ん？
エラー出とるやんけ。Deno的には正しい記述なのに。
これは入れただけじゃダメなヤツね。設定で有効にしないといけないパターン。
有効にする
こういう時って人によって行動が分かれると思うんですが
- とりあえずググる人
- 公式のドキュメントをきちんと読む人
- 公式のドキュメントを適当に読む人
- 自分で設定を漁りにいく人
私は 3 からの 4 で困ったら 2 みたいなタイプなので、拡張機能の説明欄をチラ見しただけで颯爽と作業に入ります。Usageの部分にこんな記述が
Ctrl Shift P → Deno: Initialize Workspace Configuration.
はいはい、コマンドパレットからいくやつね
しれっとNoにしてますが詳細は後述
やったぜ。
…しかしこのやり方って、ディレクトリ変わると毎回やる必要があるんですよ。
察しの良い方はもうお気づきですね。
これは .vscode/settings.jsonに設定書き込んでくれるコマンドです。
なければ勝手に作成される
簡単に言えば、そのディレクトリ下だけ有効になるVSCode用の設定。
(VSCodeって他であまり馴染みのない概念(ワークスペースとか)があったりします)
ここではVSCodeのそういう性格は置いといて。
要は 最初に一発有効にして終わりみたいに出来ないの？ という話ですよね。
有効にする ver.2
設定開いてdenoで検索すれば一発です。
(Extentions -> Deno)
これにチェックを入れればOK
有効にする ver.3
慣れてる人は.vscode/settings.json の中身見て、それをグローバル設定のJSONに直接追記するのもアリかもしれません。必要な記述は
"deno.enable": true,
"deno.lint": true,
"deno.unstable": true,
この辺です。
unstableについて
denoはいくつかの機能がunstableとして実装されています。
(実行する際は--unstableフラグを付与する必要があるやつ)
コードチェックの際にその辺りをどう扱うかの設定かと思います。。。
詳しくはわからないです、すみません。
デフォルトはfalseなので、不要な場合は上記のdeno.unstable項目はそもそも書かなくてOK。
Deno側の気持ち
ドキュメントや設定の注釈をきちんと読むと書いてありましたが、Deno側はこの拡張機能が全てのjs/tsに対して効いてしまうのを嫌ってデフォルトではオフにしているようです。至って正しい。
おまけ
さて、色々ありましたが。
無事拡張機能を有効にできましたし、これでようやく…
なんでやねん
エラーメッセージを読むと
なるほど。
エラーが出てはいますが、先程とは違いDenoのコードとして解釈した上denoエラーですね。バージョンを指定せよと。
はい。ようやくこれで解決。
まとめ
VSCodeをそこそこ使っている人はサクっと自己解決できるレベルの内容ですが、もしかしたら行き詰まってる人もいるかもしれない… と思い記事にしました。参考になれば幸いです。
Discussion