Saya bekerja dengan create-react-app
dan menemukan masalah ini di mana saya dapatkan Home does not contain an export named Home
.
Inilah cara saya menyiapkan App.js
file saya :
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { Home } from './layouts/Home'
class App extends Component {
render() {
return (
<div className="App">
Hello
<Home />
</div>
)
}
}
export default App;
Sekarang di layouts
folder saya, saya memiliki Home.js
file. yang diatur seperti berikut.
import React, { Component } from 'react';
class Home extends Component{
render(){
return(
<p className="App-intro">
Hello Man
</p>
)
}
}
export default Home;
Seperti yang Anda lihat, saya mengekspor Home
komponen tetapi saya mendapatkan kesalahan di konsol saya yang mengatakan ini.
Apa yang sedang terjadi?
Menggunakan
daripada
Hapus
{}
dari Rumahsumber
Ini adalah kasus di mana Anda mencampur ekspor default dan ekspor bernama .
Saat menangani
named
ekspor, jika Anda mencoba mengimpornya, Anda harus menggunakan tanda kurung kurawal seperti di bawah ini,Dalam kasus Anda, Rumah diekspor sebagai default. Ini adalah salah satu yang akan diimpor dari modul, ketika Anda tidak menentukan nama tertentu dari bagian kode tertentu. Saat Anda mengimpor, dan menghilangkan tanda kurung kurawal, itu akan mencari ekspor default di modul tempat Anda mengimpor. Jadi impor Anda harus,
Beberapa referensi untuk dilihat:
sumber
Saya baru saja menemukan pesan kesalahan ini (setelah memutakhirkan ke nextjs 9 beberapa impor yang transparan mulai memberikan kesalahan ini). Saya berhasil memperbaikinya menggunakan sintaks seperti ini:
sumber
Kami juga bisa menggunakan
menggunakan kata kunci ekspor sebelum kata kunci kelas.
Sebagai default
Kelas ekspor default
Kedua kasus tidak perlu ditulis
setelah kelas.
sumber
Anda dapat menggunakan dua cara untuk mengatasi masalah ini, cara pertama yang menurut saya terbaik adalah mengganti segmen impor kode Anda dengan yang di bawah ini:
atau ekspor komponen Anda tanpa default yang disebut ekspor bernama seperti ini
sumber
Inilah solusinya:
sumber