React新手求助：引入Test组件报错及找不到reactjs模块问题

Hey there! Let's break down and fix your issues step by step—since you're new to React, these are super common pitfalls, so no worries!

1. 先解决“Cannot find module reactjs”错误 #

这个问题的核心是依赖包名错误：React的官方包名是react和react-dom，不存在名为reactjs的官方包。你可能是安装时写错了包名，或者导入语句里用错了名称。

修复步骤： #

• 首先卸载错误的包（如果之前误装过）：

  npm uninstall reactjs
  

• 确保安装正确的React核心依赖：

  npm install react react-dom
  

• 检查所有组件文件里的导入语句，确保是：

  import React from 'react'; // 正确的包名是'react'，不是'reactjs'
  

2. 确保Test组件的创建与使用正确 #

接下来我们排查组件的导出和引用问题，这也是新手常踩的坑：

步骤1：正确创建并导出Test组件 #

假设你的Test组件文件是Test.js（和App.js在同一目录），要保证组件正确导出：

// Test.js
import React from 'react';

// 写法1：默认导出（推荐新手用）
const Test = () => {
  return <div>我是Test组件</div>;
};

export default Test;

// 写法2：命名导出（如果用这种，导入时要对应）
// export const Test = () => {
//   return <div>我是Test组件</div>;
// };

步骤2：在App.js中正确导入并使用 #

• 如果是默认导出的Test组件，App.js里的导入应该是：

  // App.js
  import React from 'react';
  import Test from './Test'; // 路径要正确，同一目录用./Test
  
  function App() {
    return (
      <div className="App">
        <h1>我的React应用</h1>
        <Test /> {/* 组件要以标签形式使用，不能直接写Test */}
      </div>
    );
  }
  
  export default App;
  

• 如果是命名导出，导入要改用花括号：

  import { Test } from './Test';
  

额外注意点： #

• 文件名大小写要一致：比如你的组件文件是Test.js，导入时不能写成./test（大部分操作系统区分文件名大小写）
• 确保组件文件里没有语法错误：比如漏写括号、引号，或者JSX标签没闭合

内容的提问来源于stack exchange，提问作者Hel_UI