Named and default imports, exports in JavaScript (ES Modules)

sampleexport.js

// Named export
export const data = { a: 2, b: 3 }
// There can be multiple named export from one file

// Another named export 
export const data1 = { c: 2, d: 3 }


const content = 'Hello'
// Default export
export default content
// There can be only one default export per file

// Can't do multiple default exports
// This won't work:
// const content1 = "World"
// export default content1

sampleimport.js

// . means current folder
// .. means parent folder (One folder above current folder)
// / means go inside folder
// ./ means inside current folder
// .data.js . at the start of the file name means hidden file

// import default
import content from './sampleexport.js'

// named import
import { data } from './sampleexport.js'

console.log(content, data)