无法解析React.js中的模块(未找到)

我不敢相信我在问一个明显的问题,但在控制台日志中仍然出现错误。

控制台表示无法在目录中找到该模块,但是我至少检查了10次错别字。无论如何,这是组件代码。

我想在根中渲染

import React, { Component } from 'react'

import Header from './src/components/header/header'

import logo from './logo.svg'

import './App.css'

class App extends Component {

render() {

return (

<Header/>

);

}

}

export default App;

这是Header组件

import React, { Component } from 'react'

import ReactDOM from 'react-dom'

import navBar from './src/components/header/navBar'

import './src/css/header.css'

class Header extends Component {

render() {

return {

<div>

<div id="particles-js"></div>

<navBar/>

<Title/>

</div>

};

}

}

ReactDOM.render(<Header/>, document.getElementById('header'));

我至少检查了10次该模块是否在此位置./src/components/header/header(文件夹“ header”包含“

header.js”)。

然而,React仍然抛出此错误:

./src/App.js Module not found: Can't resolve './src/components/header/header'

in '/home/wiseman/Desktop/React_Components/github-portfolio/src'

说的是同样的话。

回答:

我们通常使用的import方式基于相对路径。

.并且..类似于我们用于导航的方法,terminal例如cd ..离开目录并将mv ~/file .a file移至当前目录。

my-app/

node_modules/

package.json

src/

containers/card.js

components/header.js

App.js

index.js

您的情况App.js是,在src/目录中,而header.js在中src/components。要import你做import

Header from './components/header'。大致翻译成我的当前目录,找到包含头文件的components文件夹。

现在,如果来自header.js,则需要来自的import东西card,则可以执行此操作。import Card from

'../containers/card'。这意味着,移出当前目录,查找具有卡文件的文件夹名称容器。

至于import React, { Component } from

'react',这不符合启动./..//因此节点将开始寻找在该模块node_modules,直到以特定的顺序react被发现。要了解更多详细信息,请在此处阅读。

以上是 无法解析React.js中的模块(未找到) 的全部内容, 来源链接: utcz.com/qa/414271.html

回到顶部