reactjs 运行一个新的React项目

u1ehiz5o  于 2023-08-04  发布在  React
关注(0)|答案(3)|浏览(105)

我刚开始上Udemy React课程,所以我几乎是一个终端新手。我在这里下载了第一个React课程项目文件夹:
/Users/iancraig/TRAINING/REACT/01-starting-setup
我已经cd到这个目录“01-starting-set-up”文件夹ok,我已经运行了“npm install”但是当我想通过运行“npm start”启动服务器时,它找不到app.js。我得到:
“错误:找不到模块'/Users/iancraig/TRAINING/REACT/01-starting-setup/app.js”
app.js实际上与index.js和index.css沿着位于自己的文件夹(称为“src”)中。在这个项目中,它也被称为App.js,大写A。
这是怎么回事npm应该能够读取子文件夹吗?我怎样才能让它启动远程服务器?package.json文件包含以下内容:
“scripts”:{“start”:“react-scripts start”,“build”:“react-scripts build”,“test”:“react-scripts test”,“eject”:“react-scripts弹出”}

n7taea2i

n7taea2i1#

您面临的问题是由于文件名“App.js”与大写“A”和“index.js”文件中的导入语句不匹配。要解决这个问题,您需要确保“index.js”中的import语句与文件名完全匹配。在这种情况下,它应该是:

import App from './src/App';

字符串
另外,请确保“App.js”文件位于正确的路径中:

/Users/iancraig/TRAINING/REACT/01-starting-setup/src/App.js


完成这些更改后,您可以再次尝试运行“npm start”,它应该会成功启动服务器。

e5nqia27

e5nqia272#

app.js文件应放在src文件夹中,文件名应以大写字母开头,即App.js,并确保已将App.js文件正确导入index.js文件

import App from './src/App';

字符串
如果以上所有都正常,那么您的应用程序将正常运行,您可以使用npm start命令运行您的应用程序。

cyvaqqii

cyvaqqii3#

看起来您正在为React项目使用react-scripts,这是由Create React App(CRA)创建的一个公共设置。默认情况下,CRA希望应用程序的入口点位于src/index.js。如果您的主组件名为App.js,它应该仍然可以正常工作。您所面临的错误(“找不到模块'/Users/iancraig/TRAINING/REACT/01-starting-setup/app.js”)表明正在使用小写字母“a”而不是正确的“A”(App.js)引用app.js文件。此不匹配可能是导致问题的原因。若要修正此问题,请确定项目中任何汇入陈述式或App.js指涉都使用正确的文件名称,并以大写字母'A'。例如,在src/index.js文件中,应该有如下内容:从“react”导入React;从“react-doms”导入ReactDOM;从“./App”导入应用程序;//使用大写字母“A”更正import语句

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

字符串
如果您已经验证了App.js的import语句是正确的,但问题仍然存在,则可能存在其他一些配置问题。在这种情况下,请仔细检查您的项目结构,并确保所有设置都符合预期。如果仍然有问题,可以考虑发布代码的相关部分或文件夹结构,以获得更具体的帮助。请记住,在纠正任何文件引用之后,再次运行npm start,它应该会成功地启动开发服务器。如果没有其他问题,您的React应用程序应该可以在http://localhost:3000上访问。

相关问题