0
import Navbar from "./components/Navbar"
import Main from "./components/Main"


export default function App() {


  return (
    <div className="container">
      <Navbar />
      <Main />

    </div>
  )
}

So basically I haven't fully been able to understand the difference between import and export and they both seem to be pretty much the same? But if that's the case how come if I replace import Main from "./components/Main" with var Main = require("./components/Main") this doesn't work anymore?

  • You can check this thread https://stackoverflow.com/questions/31354559/using-node-js-require-vs-es6-import-export – Nick Vu Nov 09 '22 at 03:53
  • Does this answer your question? [Using Node.js require vs. ES6 import/export](https://stackoverflow.com/questions/31354559/using-node-js-require-vs-es6-import-export) – cafce25 Nov 09 '22 at 03:54

1 Answers1

1

Actually, the type of script file (.js file) in react is 'module' so it uses the latest import/export command which is import Main from "./components/Main". However, earlier this was not the case & even now when we write backend codes, we don't define the script file's type as 'module' and thus it will not support import Main from "./components/Main" and will support var Main = require("./components/Main"). If you need more clarification on it, please do tell.