browserify - require 之前作为 import 语句被调用

Question

我有一个模块 m1，需要先初始化该模块，然后才能导入模块 m2:

import * as m1 from 'm1';
m1.init(...)
import * as m2 from 'm2';

我更新了 browserify 并从 6to5ify 切换到 babelify 转换器。之后，我的包中的 require 调用被移至顶部:

...
var _m1 = require('./m1');
var m1 = _interopRequireWildcard(_m1);
var _m2 = require('./m2');
var m2 = _interopRequireWildcard(_m2);
m1.init('init value');
...

为什么 require 调用移至顶部？我可以在调用 m1.init 后使用 ES6 模块导入语法导入 m2 吗？我可以直接使用require

import * as m1 from 'm1';
m1.init(...)
const m2 = require('m2');

我明白了

var _m1 = require('./m1');
var m1 = _interopRequireWildcard(_m1);
m1.init('init value');
var m2 = require('./m2');

但这对我来说似乎是一种黑客行为。

Answer 1

导入应该被视为 ES6 中的提升值。它们始终位于模块的顶部。您当前依赖于隐式依赖关系。如果 m2 不仅依赖于 m1 的加载，而且还依赖于 m1 的初始化，那么您应该有一个显式返回 m1 的初始化版本的模块，那么如果您无法直接修改 m2，那么它应该明确地取决于该值或通过导入顺序，例如

init-m1.js

import * as m1 from 'm1';
m1.init(...)
export default m1;

init-m2.js

import m1 from './init-m1';
import * as m2 from 'm2';