The requested module does not provide an export named 해결법

코드를 작성하다가

The requested module '/src/components/header/index.jsx' does not provide an export named 'Header'

 

이와 같은 오류가 뜨길래 2가지 방법을 시도해봤다.

 

첫번째로는 이 블로그를 참고해서 하다가 안되길래 

https://velog.io/@ddaa111/export-default-%EB%AA%A8%EB%93%88-%EB%B6%88%EB%9F%AC%EC%98%A4%EA%B8%B0-%EC%97%90%EB%9F%AC

export default 모듈 불러오기 에러

 

 

 

두번째는 아래와 같이 중괄호로 자동 import 됐던걸 

import './App.css'
// import React from "react";
// import styled from "styled-components";
import { SideDeck } from "./components/side-deck/index.jsx";
import { OnMapCard } from "./components/on-map-card/index.jsx"
import { InfoCard } from './components/info-card/index.jsx';
import { Header } from "./components/header/index.jsx";
function App() {


  return (
    <>
      <Header/>
      <SideDeck />
      <InfoCard/>
      <OnMapCard/>
    </>
  )
}

export default App

import './App.css'
import SideDeck from "./components/side-deck/index.jsx";
import OnMapCard from "./components/on-map-card/index.jsx"
import InfoCard from './components/info-card/index.jsx';
import Header from "./components/header/index.jsx";

function App() {
  return (
    <>
      <Header/>
      <SideDeck />
      <InfoCard/>
      <OnMapCard/>
    </>
  )
}

export default App

 

이렇게 중괄호를 빼고 했더니 아주 잘됐다.

 

 

 

정말 어이없는 오류... 이제 함부로 vscode믿으면 안될 듯