在 ES6 與 CommonJS 模塊中共享 state

Question

我可以通過 CommonJS 模塊共享 state，但不能通過 ES6 模塊。

我想知道為什么，想知道如何通過 ES6 模塊共享 state。

通用JS

主.js：

const shared = require('./shared.js');
shared.val = 2;
require('./child.js');
console.log('main.js', shared);

孩子.js：

const shared = require('./shared.js');
console.log('child.js', shared);

共享.js：

module.exports = {val:1};

結果：

$ node main.js
child.js { val: 2 }
main.js { val: 2 }

ES6

主.mjs：

import shared from './shared.mjs';
shared.val = 2;
import a from './child.mjs';
console.log('main.mjs', shared);

孩子.mjs：

import shared from './shared.mjs';
console.log('child.mjs', shared);
export default undefined;

共享.mjs:

export default {val:1};

結果：

$ node main.mjs
child.mjs { val: 1 }
main.mjs { val: 2 }

Answer 1

您可以用完全相同的方式分享 state。

但您不能在導入之間運行代碼。 它們都應該在你的文件的頂部，因為它們基本上被提升到頂部。

如果你把孩子改成這樣：

import shared from './shared.mjs';

export default () => {
  console.log('child', shared);
};

然后在更改共享后運行它：

import shared from './shared.mjs';
import runChild from './child.mjs';

shared.val = 2;

console.log('main', shared);
runChild();

他們都會有{ val: 2 } 。