I start a node project by using npm init -y and i configured it for using common js. I created two files which are index.js and app.js
Content of index.js
const {person2,greetingFromPerson2} = require('./app.js');
const person1 = 'Abraham';
module.exports = person1;
console.log(`${person1} greets ${person2}`);
greetingFromPerson2();
Content of app.js
const person1 = require('./index.js');
const person2 = 'John';
const greetingFromPerson2 = () =>{
console.log(`${person2} greets ${person1}`);
}
module.exports = {person2,greetingFromPerson2};
When i ran node index.js
command the output i got was the following
Abraham greets John
Abraham greets John
John greets [object Object]
(node:3856) Warning: Accessing non-existent property 'Symbol(Symbol.toPrimitive)' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
(node:3856) Warning: Accessing non-existent property 'Symbol(Symbol.toStringTag)' of module exports inside circular d
If change the code of index.js like below
let person1;
module.exports = person1;
const {person2,greetingFromPerson2} = require('./app.js');
person1 = 'Abraham';
console.log(`${person1} greets ${person2}`);
greetingFromPerson2();
and then run node index.js
, I get the following output
Abraham greets John
John greets undefined
So I'am Assuming that app.js's imports value is like the snapshot of those person1 variable state when app.js was required in index.js. That means when app.js was imported in index.js person1 was not defined and exported, so person1's import value in app.js becomes undefined in that case. If the person1 variable declaration and initialization and export was before app.js was imported into index.js then person1's value at that import moment should be available in app.js. Is this assumption correct.
But when i changed the package.json configuration for the project to use es module type and changed the content of index.js to the below code
import { person2, greetingFromPerson2 } from './app.js';
let person1 = 'Abraham';
console.log(`${person1} greets ${person2}`);
export default person1;
greetingFromPerson2();
and changed the code of app.js as shown below
import person1 from './index.js';
export const person2 = 'John';
export const greetingFromPerson2 = () =>{
console.log(`${person2} greets ${person1}`);
}
and run node index.js
and following output appeared
Abraham greets John
John greets Abraham
I have read that in es6 module only after running the import files the actual root javascript runs, so at first when app.js was running before index.js how did app.js got access to person1 variable in index.js. Can someone explain how this works and why when using common.js,app.js could not access person1 from index.js and what is the execution order of commonjs compared to es module and what is the warning in the first output actually means.
And i think it will good resource if someone can detail how module.exports in common js works, export default and export in es module works by making analogy with each other. Because if someone is able create a answer by making analogies, i think it will be valuable answer for others also.