2019-4-3

[VSCode]jsconfig.jsonに関して

雑な技術メモ

jsconfig.json Reference

VSCode の JS に関する設定ファイル

include/exclude

プロジェクトのソースコードとして認識させるファイル群をホワイトリスト/ブラックリスト形式で指定する。両方共 glob パターンが使用できる。

注意点はincludeexcludeによって除外されたファイルも検索対象ではあるということ。ファイルを解析の対象から除外することでパフォーマンスの向上を目論むのが主目的みたい。例えば、この設定をしておくと minify され出力されたファイルをうっかり開いてしまってファイルの解析が始まりもたつくみたいな事がなくなるとかそういうあれ。

ドキュメントには記載が見当たらなかったけど、.gitignoreされているファイルに関してはデフォルトで無視されてる感じがする。

それぞれの書き方は以下の通り、

{
  "exclude": {
    "node_modules"
  }
}
{
  "include": {
    "src/**/*"
  }
}

includeが指定されていない場合、ワークスペース内の全ファイルがソースコードとしてみなされる。

compilerOptions配下のオプション

オプション 説明
noLib lib.d.tsを include しない
target どのlib.d.tsを使用するか。"es3", "es5", "es6", "es2015", "es2016", "es2017", "es2018", "esnext"のどれかを指定
checkJs JavaScript ファイルの型チェックを有効にする
experimentalDecorators 提案段階の ES デコレータの試験的サポートを有効にする
allowSytheticDefaultImports export defaultが存在しないモジュールからのimport defaultを許可する。これはチェックするだけで出力されるコードには影響しない。
baseUrl 相対パス指定されていないモジュールを解決するためのベースディレクトリ
paths baseUrl を基準とした相対パスのパスマッピング

checkJsあたりは、JS でもできる範囲で型チェックしてくれるので結構使い所が多いかもしれない。

lib.d.ts

lib.d.ts - TypeScript Deep Dive 日本語版

JS の標準関数とかブラウザ標準 API 関係の型定義ファイルみたい。

VSCode に webpack とか VueCLI とかでよくある alias を認識させる

baseUrlpathsを指定することで認識させる。

例えば、@srcのエイリアスである場合、

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

と書けばいい。エイリアスを利用しているプロジェクトでは絶対設定したい。