'React' phải nằm trong phạm vi khi sử dụng JSX react / react-in-jsx-scope?

Tôi là một Nhà phát triển Angular và mới sử dụng React, Đây là Thành phần phản ứng đơn giản nhưng không hoạt động

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;

Lỗi: 'React' phải nằm trong phạm vi khi sử dụng JSX react / react-in-jsx-scope

Dòng nhập phải là:

import React, { Component }  from 'react';

Lưu ý chữ hoa R cho React.

Đối với những người vẫn không nhận được giải pháp được chấp nhận:

Thêm vào

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

ở đầu tệp.

Thêm cài đặt bên dưới để .eslintrc.js/ .eslintrc.jsonđể bỏ qua những lỗi này:

  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
  }

Tại sao? Nếu bạn đang sử dụng NEXT.jsthì bạn không yêu cầu nhập Reactở đầu tệp, nextjs thực hiện điều đó cho bạn.

import React, { Component } from 'react';

Đây là một lỗi chính tả, bạn cần phải gõ Reactthay vì react.