[解決済み] vs-codeで複数のtsconfigファイルを使用するには?
質問
私はVisual Studio Codeを使用しており、かなり一般的なプロジェクト構造を持っています。
├── client/
│ ├── tsconfig.json
├── shared/
├── server/
│ ├── tsconfig.json
├── project.json
2つのtsconfigファイルはそれぞれ異なる設定になっています(例えば
client/
の下にあるものは ES5 をターゲットにしています。
server/
の下にあるものはES6をターゲットにしています)。ルートディレクトリにはtsconfigがないことに注意してください。
問題は、共有ディレクトリが両方のプロジェクトに含まれるようにしたいことです。tsconfigを使用してこれを行うことはできません。
exclude
オプションは、tsconfig.jsonよりも上位のディレクトリにあるフォルダを含めることを許可しないので、tsconfigを使用してこれを行うことはできません。
files
グロブをサポートしていないので、常にファイルのリストを最新に保つ必要があります。
私が欲しいのは Visual Studio Code IDE がインテリセンスなどのために共有コードを認識することです。
を待つしかないのでしょうか。 ファイル グロブ ?
どのように解決するのですか?
最近では、vscodeのサポートが充実しているので、より簡単になりました。
このディレクトリ構造を利用することで、すべてのコードが独立します。
├── frontend/
│ ├── src/
│ │ ├── <frontend code>
│ ├── package.json
│ ├── tsconfig.json
├── shared/
│ ├── package.json
├── backend/
│ ├── src/
│ │ ├── <backend code>
│ ├── package.json
│ ├── tsconfig.json
次に、バックエンドとフロントエンドの両方で
tsconfig.json
:
{
"compilerOptions": {
"paths": {
"~shared/*": ["../shared/*"]
},
"rootDirs": [
"./src",
"../shared"
]
}
}
共有コードにアクセスできるようにするためなど。
import { Foo } from '~shared/foo';
古い回答
単一の
tsconfig.json
をルートに使います。そして、各プロジェクトごとにそれを拡張します (バックエンドの
tsconfig.server.json
フロントエンド
tsconfig.webpack.json
).
-
ルート
tsconfig.json
include: ['src']
すべてのファイルが IDE でタイプチェックされるようにするために -
バックエンド
tsconfig.server.json
exclude: ['src/app']
フロントエンドのファイル -
フロントエンド :
tsconfig.webpack.json
exclude: ['src/server']
バックエンドファイル
フォルダ構造
├── src/
│ ├── app/ < Frontend
│ ├── server/ < Backend
│ ├── common/ < Shared
├── tsconfig.json
├── tsconfig.server.json
├── tsconfig.webpack.json
設定ファイル
tsconfig.json
{
"compilerOptions": {
"noImplicitAny": true,
"strictNullChecks": true
},
"include": [
"src"
]
}
tsconfig.webpack.json
{
"extends": "./tsconfig.json",
"exclude": [
"src/app"
]
}
tsconfig.server.json
{
"extends": "./tsconfig.json",
"exclude": [
"src/server"
]
}
もっと見る
関連
-
[解決済み] ファイルを常に新しいタブで開く
-
[解決済み] Visual Studio Codeでの縦書きルーラー
-
[解決済み] Visual Studio Code for Windowsでコードのセクションを折りたたむにはどうしたらいいですか?
-
[解決済み] Visual Studio Code(VSCode)でコードをフォーマットするにはどうすればよいですか?
-
[解決済み] Visual Studio Codeでファイルを検索するにはどうすればよいですか?
-
[解決済み] Visual Studio Codeのサイドバーから特定のファイルを非表示にするにはどうすればよいですか?
-
[解決済み】「エクスプローラー」タブからフォルダを除外する方法は?
-
[解決済み] Visual Studio Code - インポート引用符の設定を調整する
-
[解決済み] Promiseの型はどのようにアンラップするのですか?
-
[解決済み] TypeScript 2: 型付けされていない npm モジュールのためのカスタム型付け
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] TypeScriptの予約語 "type "とは何ですか?
-
[解決済み] Visual Studio Code - インポート引用符の設定を調整する
-
[解決済み] モジュールと名前空間 - Import vs Require Typescript
-
[解決済み] TypeScript "this" scoping issue when called in jquery callback.
-
[解決済み] typescriptでmoment.jsをインポートするには?
-
[解決済み] typescriptのインターフェイスを別ファイルで宣言しインポートする方法
-
[解決済み] 他のプロパティを使用できる TypeScript インターフェース
-
[解決済み] 2つのインターフェイスを統合する
-
[解決済み] Angular 2で相対パスが非常に長いインポートを回避する方法とは?
-
[解決済み] TypeScriptのInterfacesでgetter/setterを使用することは可能ですか?重複