I have used https://github.com/FountainJS/generator-fountain-webapp to set up a new project using React & Typescript. I'm pretty comfortable with JS having used node for an ongoing project, but not familiar with TS where the problem seems to lie.
I have ran the generator with the following environment: typescript, react, webpack w/ NPM, gulp.
When I run gulp serve
I get the output below. I'm quite confused why it can't find the files - they are all there on my file system. I've looked at other questions and haven't found anything that resolves my issue
[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
The "Cannot find module or its corresponding type declarations" error occurs when TypeScript cannot locate a third-party or local module in our project. To solve the error, make sure to install the module and try setting moduleResolution to node in your tsconfig. json file.
To solve the cannot find module 'typescript' error, make sure to install typescript globally by running the npm i -g typescript command and create a symbolic link from the globally-installed package to node_modules by running the npm link typescript command. Copied!
To solve the "Cannot find module path or its corresponding type declarations" error, install the types for node by running the command npm i -D @types/node . You can then import path with the following line of code import * as path from 'path' .
If you are getting the "Cannot find module" error when trying to run a local file, make sure that the path you passed to the node command points to a file that exists. For example, if you run node src/index. js , make sure that the path src/index. js points to an existing file.
̶R̶e̶m̶o̶v̶i̶n̶g̶ ̶"̶m̶o̶d̶u̶l̶e̶"̶ ̶a̶n̶d̶ ̶"̶t̶a̶r̶g̶e̶t̶"̶ ̶f̶i̶e̶l̶d̶s̶ ̶f̶r̶o̶m̶ ̶̶t̶s̶c̶o̶n̶f̶i̶g̶.̶j̶s̶o̶n̶
̶ ̶w̶o̶r̶k̶e̶d̶ ̶f̶o̶r̶ ̶m̶e̶.̶
Update: removing target
is ok, but removing module
is not an option as the compiler depends on it. You can also solve the problem by adding "moduleResolution": "node"
to the tsconfig
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With