[解決済み] TSがモジュールを見つけ出せない

質問

私は https://github.com/FountainJS/generator-fountain-webapp を使用して新しいプロジェクトを立ち上げるために、React & Typescriptを使用します。私は進行中のプロジェクトでnodeを使用していたので、JSにはかなり慣れていますが、問題があるように思われるTSには慣れていません。

typescript, react, webpack w/ NPM, gulpの環境でジェネレータを動かしてみました。

を実行すると gulp serve 以下のような出力が得られます。ファイルシステム上にすべてあるのに、なぜファイルが見つからないのか、かなり混乱しています。他の質問も見ましたが、私の問題を解決するものは見つかりませんでした。

[23:04:52] Loading /Users/omelvin/github_projects/kaizen/gulp_tasks/browsersync.js
[23:04:53] Loading /Users/omelvin/github_projects/kaizen/gulp_tasks/karma.js
[23:04:54] Loading /Users/omelvin/github_projects/kaizen/gulp_tasks/misc.js
[23:04:54] Loading /Users/omelvin/github_projects/kaizen/gulp_tasks/webpack.js
[23:04:54] Using gulpfile ~/github_projects/kaizen/gulpfile.js
[23:04:54] Starting 'serve'...
[23:04:54] Starting 'webpack:watch'...
ts-loader: Using [email protected] and /Users/omelvin/github_projects/kaizen/tsconfig.json
[23:05:01] Time: 6436ms
       Asset     Size  Chunks       Chunk Names
    index.js  1.11 MB       0       main
index.js.map  1.32 MB       0       main

ERROR in ./src/index.tsx
(5,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/index.tsx
(6,27): error TS2307: Cannot find module 'react-dom'.

ERROR in ./src/index.tsx
(7,45): error TS2307: Cannot find module 'react-router'.

ERROR in ./src/index.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in ./src/app/title.tsx
(3,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/app/title.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in ./src/app/techs/techs.tsx
(3,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/app/techs/techs.tsx
(4,24): error TS2307: Cannot find module 'axios'.

ERROR in ./src/app/techs/techs.tsx
(33,10): error TS2339: Property 'state' does not exist on type 'Techs'.

ERROR in ./src/app/techs/techs.tsx
(39,24): error TS2503: Cannot find namespace 'Axios'.

ERROR in ./src/app/techs/techs.tsx
(40,14): error TS2339: Property 'setState' does not exist on type 'Techs'.

ERROR in ./src/app/techs/techs.tsx
(51,17): error TS2339: Property 'state' does not exist on type 'Techs'.

ERROR in ./src/app/techs/techs.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in ./src/app/techs/tech.tsx
(3,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/app/techs/tech.tsx
(50,44): error TS2339: Property 'props' does not exist on type 'TechComponent'.

ERROR in ./src/app/techs/tech.tsx
(52,17): error TS2339: Property 'props' does not exist on type 'TechComponent'.

ERROR in ./src/app/techs/tech.tsx
(54,18): error TS2339: Property 'props' does not exist on type 'TechComponent'.

ERROR in ./src/app/techs/tech.tsx
(55,18): error TS2339: Property 'props' does not exist on type 'TechComponent'.

ERROR in ./src/app/techs/tech.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in ./src/app/main.tsx
(3,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/app/main.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in ./src/app/header.tsx
(3,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/app/header.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in ./src/app/footer.tsx
(3,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/app/footer.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(4,24): error TS2307: Cannot find module 'react'.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(5,27): error TS2307: Cannot find module 'react-dom'.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(6,28): error TS2307: Cannot find module 'react-addons-test-utils'.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(10,1): error TS2304: Cannot find name 'describe'.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(11,3): error TS2304: Cannot find name 'it'.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(14,5): error TS2304: Cannot find name 'expect'.

ERROR in /Users/omelvin/github_projects/kaizen/src/app/footer.spec.tsx
(1,1): error TS6053: File '/Users/omelvin/github_projects/kaizen/typings/index.d.ts' not found.
Child html-webpack-plugin for "index.html":
         Asset    Size  Chunks       Chunk Names
    index.html  564 kB       0
[23:05:01] Finished 'webpack:watch' after 6.45 s
[23:05:01] Starting 'watch'...
[23:05:01] Finished 'watch' after 54 ms
[23:05:01] Starting 'browsersync'...
[23:05:01] Finished 'browsersync' after 78 ms
[23:05:01] Finished 'serve' after 6.58 s
[BS] [BrowserSync SPA] Running...
[BS] Access URLs:
 --------------------------------------
       Local: http://localhost:3000
    External: http://10.193.122.24:3000
 --------------------------------------
          UI: http://localhost:3001
 UI External: http://10.193.122.24:3001
 --------------------------------------
[BS] Serving files from: .tmp
[BS] Serving files from: src
ts-loader: Using [email protected] and /Users/omelvin/github_projects/kaizen/tsconfig.json
webpack built 5ccca2fe23cfa5a1a610 in 5073ms

解決方法は？

TypeScriptは、ライブラリの型やインターフェイスなどを定義する定義ファイルに依存しています。私はFountainJSに詳しくないのですが、FountainJSは十分にスマートであり、定義ファイルを作成するために typings.json ファイルをワークスペースに作成します。もしそうなら、あなたがすべきことは、ワークスペースに タイピング ( npm install typings --global ) を行い、それを使って定義ファイルをインストールします。 typings install .

を含めなかった場合 typings.json (の説明に従ってください。 README を検索し、依存関係の定義をインストールします。

私は一般的に、以下の行を package.json を実行するたびに、自動的にタイピングがインストールされるようにします。 npm install

"scripts": { "postinstall": "npm run typings", "typings": "typings install", }

TypeScriptに慣れていない方は、基本的なチュートリアルを見てから始めることをお勧めします。 https://www.typescriptlang.org/docs/tutorial.html .