有什么办法可以解决 javascript 中找不到模块的错误吗？

Question

我正在创建一个待办事项列表网络应用程序，但有些错误发生在它说的地方

编译有问题：

./src/Components/TodoList.js 6:0-57 中的错误

找不到模块：错误：无法解析 'C:\Users\91826\Desktop\WD\projects\todo-list\src\Components' 中的 './react/cjs/react.development'

有人可以告诉我如何解决这个问题。

TodoForm.js 中的代码

import React, {useState} from "react";
export default function TodoForm(props){
  // state
  const [input, setInput] = useState("");


  const handleChange = e => {
    setInput(e.target.value)
    }

  const handleSubmit = (e) => {
    e.preventDefault();
    props.addTask({
      id: Math.floor(Math.random() * 1000000),
      text: input,
      isComplete: false
  })
    setInput('')
}
return(
    <form>
      <input type="text" placeholder="Add a todo" onChange={handleChange} className="todo-input" value={input} name="text"/>
      <button type="submit" onClick={handleSubmit} className= "todo-btn" >ADD TODO</button>
                                                 
</form>
);
}

TodoList.js 中的代码

import React from 'react';
import {useState} from './react/cjs/react.development';
 import TodoForm from './TodoForm'
export default function TodoList(){
   const [todos, setTodos] = useState([]);
  const addTask = task => {
    if (!task.text) {
      return
    }
     const newTodos = [task, ...todos];
    setTodos(newTodos);
}
  return <div>
     <TodoForm addTask={addTask} ></TodoForm>
   </div>;
}

App.js 中的代码

import './App.css';
import TodoList from './Components/TodoList'
function App() {
  return (
    <div className="Todo-list-container">
     <TodoList/>
    </div>
  );
}

export default App;

I expect this(check out the pic) I got this(check out the pic)

Answer 1

useState 应该从 React 本身导入，所以这两行：

import React from 'react';
import {useState} from './react/cjs/react.development';

应该改成

import React, { useState } from "react";