carlrip / LearnReact17WithTypeScript

MIT License
57 stars 44 forks source link

Ch.3 npm start issues and solutions #6

Closed shnjtk closed 5 years ago

shnjtk commented 5 years ago

Hi, I'm in Ch.3, I got some errors and fixed it by myself. Let me share my solution for other readers.

Error 1:

When I ran npm start first time, following error was occurred.

TypeScript error in /Users/shnjtk/reactts3/chapter03/my-components/src/App.tsx(1,19):
Could not find a declaration file for module 'react'. '/Users/shnjtk/reactts3/chapter03/my-components/node_modules/react/index.js' implicitly has an 'any' type.
  If the 'react' package actually exposes this module, consider sending a pull request to amend 'https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react`  TS7016

  > 1 | import React from "react";
      |                   ^
    2 | import logo from "./logo.svg";
    3 | import "./App.css";
    4 | 

Solution

I added "noImplicitAny": false to compilerOptions in tsconfig.json. But I know it's just suppressing the error. Please tell me If anyone knows better solution.

Error 2:

Then, I tried npm start again and got following error.

/Users/shnjtk/reactts3/chapter03/my-components/src/serviceWorker.ts
TypeScript error in /Users/shnjtk/reactts3/chapter03/my-components/src/serviceWorker.ts(29,7):
Cannot find name 'process'. Do you need to install type definitions for node? Try `npm i @types/node`.  TS2580

    27 | 
    28 | export function register(config?: Config) {
  > 29 |   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
       |       ^
    30 |     // The URL constructor is available in all browsers that support SW.
    31 |     const publicUrl = new URL(
    32 |       (process as { env: { [key: string]: string } }).env.PUBLIC_URL,

Solution

I added "types": ["node"] to compilerOptions in tsconfig.json.

Error 3:

After that, npm start shows following error.

undefined
TypeScript error in undefined(undefined,undefined):
Cannot find type definition file for 'node'.  TS2688

Solution

Just do following.

$ npm install @types/node

That's it.

I hope this helps other readers. And thanks for writing this book @carlrip, I'm having fun reading!

carlrip commented 5 years ago

Thanks @shnjtk, just doing a npm install when you get the Could not find a declaration file for module 'react' error usually resolves the problem.

shnjtk commented 5 years ago

Thanks @carlrip for the advice, I'll try it when I get that error. I'll close this issue.

evertonProgramadorCriativo commented 4 years ago

deu certo para min , ok

FilipeAlvares commented 4 years ago

Hi, I'm in Ch.3, I got some errors and fixed it by myself. Let me share my solution for other readers.

Error 1:

When I ran npm start first time, following error was occurred.

TypeScript error in /Users/shnjtk/reactts3/chapter03/my-components/src/App.tsx(1,19):
Could not find a declaration file for module 'react'. '/Users/shnjtk/reactts3/chapter03/my-components/node_modules/react/index.js' implicitly has an 'any' type.
  If the 'react' package actually exposes this module, consider sending a pull request to amend 'https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react`  TS7016

  > 1 | import React from "react";
      |                   ^
    2 | import logo from "./logo.svg";
    3 | import "./App.css";
    4 | 

Solution

I added "noImplicitAny": false to compilerOptions in tsconfig.json. But I know it's just suppressing the error. Please tell me If anyone knows better solution.

Error 2:

Then, I tried npm start again and got following error.

/Users/shnjtk/reactts3/chapter03/my-components/src/serviceWorker.ts
TypeScript error in /Users/shnjtk/reactts3/chapter03/my-components/src/serviceWorker.ts(29,7):
Cannot find name 'process'. Do you need to install type definitions for node? Try `npm i @types/node`.  TS2580

    27 | 
    28 | export function register(config?: Config) {
  > 29 |   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
       |       ^
    30 |     // The URL constructor is available in all browsers that support SW.
    31 |     const publicUrl = new URL(
    32 |       (process as { env: { [key: string]: string } }).env.PUBLIC_URL,

Solution

I added "types": ["node"] to compilerOptions in tsconfig.json.

Error 3:

After that, npm start shows following error.

undefined
TypeScript error in undefined(undefined,undefined):
Cannot find type definition file for 'node'.  TS2688

Solution

Just do following.

$ npm install @types/node

That's it.

I hope this helps other readers. And thanks for writing this book @carlrip, I'm having fun reading!

'npm install @types/react -D'

this will solve your problem number 1