ES6 运行时交换模块

Question

我有 api.js，它加载mock.js 或server.js 并将其导出。结果是，根据服务器环境变量，我可以在后端之间交换。

问题是，我想在运行时执行此操作，而不影响已经使用mock.js 和 server.js 模块的“api”的所有代码。

我希望我的应用程序根据连接状态使用mock.js 或server.js。以下代码仅在初始化期间起作用，而不是在运行时起作用。

import server from './server'
import mock from './mock'

let backend = null
if (process.env.NODE_ENV === 'development' && Math.random() > 0.5 ) {
  backend = mock
} else {
  backend = server
}

export default backend

Answer 1

如果需要，您可以利用 ES6 实时绑定，例如

import server from './server';
import mock from './mock';

export { backend as default };

let backend = server;

setInterval(() => {
    backend = Math.random() > 0.5 ? mock : server;
}, 1000);

这将每秒随机更改默认导出。

在 ES6 中，导入的变量是对导出值的模块中变量的实时引用，因此您可以

import backend from "./api";

并且该backend值会随着时间而变化。

特别是在你的情况下，改变

export default backend;

到

export { backend as default};

至关重要，因为第一个不起作用，因为它是缩写

const uniqueTempVal = backend;
export { uniqueTempVal as default };

正如您所看到的，这意味着backend稍后重新分配不会影响导出的值。