Invalid JSON import in React

Question

i got this error while trying import data from JSON file in the App component below:

Uncaught TypeError: start is undefined

import './App.css';
import PreNavbar from './Components/PreNavbar';
import Navbar from "./Components/Navbar.js";
import {BrowserRouter as Router} from "react-router-dom";
import Slider from "./Components/Slider.js";
import banner from "./data/data.json";

function App( ) {
  return (
    

    <Router>

      <PreNavbar />
      <Navbar />
      <Slider start = {banner.start} />

    
    </Router>
  );
}

export default App;

Here is the Slider component:

import React from 'react';
import Carousel from 'react-bootstrap/Carousel';

const Slider = ({start}) => {
  return (
    <Carousel>

      {start.map((item, index) => (

        <Carousel.Item>
          <img className='d-block w-100' src={item}
            alt="First slide" />

      </Carousel.Item>

      ))}


    </Carousel>
  )
}

export default Slider;

If i use {} in banner export, like so:

import {banner} from "./data/data.json";

I face this other error:

ERROR in ./src/App.js
Should not import the named export 'banner'.'start' (imported as 'banner') from default-exporting module (only default export is available soon)