Theme
SD MILIEU

2019-4-3

[VSCode]jsconfig.jsonに関して

jsconfig.json Reference

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

include/exclude

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

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

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

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

{
  "exclude": {
    "node_modules"
  }
}

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

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

compilerOptions配下のオプション

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

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

lib.d.ts

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

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

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

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

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

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

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