[英]How can I solve this error? "export 'default' (imported as 'App') was not found in './App' (possible exports: App)" (im using react)
heyyy.嘿嘿。 i wanted to try out react with this tutorial.
我想尝试对本教程做出反应。
at the moment I have only made the data structure.目前我只制作了数据结构。 unfortunately i always get an error when compiling.
不幸的是,我在编译时总是出错。
Error错误
Compile failed.
Attempted import error: './App' does not contain default export (imported as 'App').
Assets by state 1.6 MiB [cached] 2 assets
Assets by path . 930 bytes
asset index.html 658 bytes [emitted]
asset-manifest.json 272 bytes [emitted]
cached modules 1.39 MiB (javascript) 1 bytes (asset) 28.1 KiB (runtime) [cached] 144 modules
./src/index.js 1.34 KiB [built]
ERROR in ./src/index.js 8:38-41
export 'default' (imported as 'App') was not found in './App' (possible exports: App)
webpack 5.66.0 compiles with 1 error in 63 ms
App.js应用程序.js
import React from 'react'
import { Footer, Blog, Possibility, Features, WhatWELOVEU, Header } from './containers';
import { CTA, Brand, Navbar } from './components';
export const App = () => {
return (
<div className='App'>
<div className='gradient_bg'>
<Navbar />
<Header />
</div>
<Brand />
<WhatWELOVEU />
<Features />
<Possibility />
<CTA />
<Blog />
<Footer />
</div>
)
}
index.js index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(<App />, document.getElementById('root'));
these two files are in the "src" folder.这两个文件位于“src”文件夹中。 in the "src" folder there are also the components and containers.
在“src”文件夹中还有组件和容器。 everything is described in the tutorial and the data structure is the same.
教程中描述了所有内容,数据结构相同。 enter image description here
在此处输入图像描述
In the folder components and container are.jsx and css files.在文件夹 components 和 container 中有 .jsx 和 css 文件。 all css FIles nid empty, in the jsx files you can find the same code always adapted to the name of the file.
所有 css 文件都是空的,在 jsx 文件中,您可以找到始终适应文件名的相同代码。
p.ex. p.ex. Article.jsx
文章.jsx
import React from 'react'
import './article.css';
const Article = () => {
return (
<div>
Article
</div>
)
}
export default Article
enter image description here在此处输入图像描述
In containers and components are also index files.在容器和组件中也是索引文件。
components/index.js组件/index.js
export { default as Article } from './article/Article';
export { default as Brand } from './brand/Brand';
export { default as CTA } from './cta/CTA';
export { default as Feature } from './feature/Feature';
export { default as Navbar } from './navbar/Navbar';
containers/index.js容器/index.js
export { default as Blog } from './blog/Blog';
export { default as Features } from './features/Features';
export { default as Footer } from './footer/Footer';
export { default as Header } from './header/Header';
export { default as Possibility } from './possibility/Possibility';
export { default as WhatWELOVEU } from './whatWELOVEU/whatWELOVEU';
try this in you index.js
在你的
index.js
中试试这个
import { App } from './App'
or you could change in your App.js
to this或者您可以将您的
App.js
更改为此
import React from 'react'
import { Footer, Blog, Possibility, Features, WhatWELOVEU, Header
} from './containers';
import { CTA, Brand, Navbar } from './components';
export default const App = () => {
return (
<div className='App'>
<div className='gradient_bg'>
<Navbar />
<Header />
</div>
<Brand />
<WhatWELOVEU />
<Features />
<Possibility />
<CTA />
<Blog />
<Footer />
</div>
)
}
Two options.两种选择。 Choose one.
选一个。 Hopefully can help you.
希望能帮到你。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.