JSX react / react-in-jsx-scope를 사용할 때 'React'가 범위 내에 있어야합니까?

저는 Angular 개발자이며 React를 처음 사용합니다. 이것은 간단한 반응 구성 요소이지만 작동하지 않습니다.

import react , { Component}  from 'react';
import         { render   }  from 'react-dom';

class TechView extends Component {

    constructor(props){
       super(props);
       this.state = {
           name:'Gopinath'
       }
    }
    render(){
        return(
            <span>hello Tech View</span>
        );
    }
}

export default TechView;

오류 : JSX react / react-in-jsx-scope를 사용할 때 'React'가 범위 내에 있어야합니다.

가져 오기 라인은 다음과 같아야합니다.

import React, { Component }  from 'react';

React의 대문자 R에 유의하십시오.

여전히 수용된 솔루션을 얻지 못하는 사람들을 위해 :

더하다

import React from 'react'
import ReactDOM from 'react-dom'

파일 상단에 있습니다.

이러한 오류를 무시 하려면 .eslintrc.js/ .eslintrc.json에 아래 설정을 추가하십시오 .

  rules: {
    // suppress errors for missing 'import React' in files
   "react/react-in-jsx-scope": "off",
    // allow jsx syntax in js files (for next.js project)
   "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }], //should add ".ts" if typescript project
  }

왜? 사용하는 경우 파일 상단 NEXT.js에서 가져올 필요가 없습니다 React. nextjs가 대신 수행합니다.

import React, { Component } from 'react';

철자 오류 React입니다 react. 대신 을 입력해야합니다 .