Question

我正在尝试将模块B导入模块A.我想让模块B访问模块A中的所有本地范围。

在webpack之前，我这样做了：

 var scope = this;

然后我会检查是否存在这样的实体

if (!('blah' in scope)) {
          throw new Error('method of "' + 'blah' + '" not in scope')
}

我也可以通过scope.blah = ....

在模块B中设置模块A.

这可以用webpack吗？

我尝试使用DefinePlugin和ProvidePlugin，但我似乎无法让模块B访问模块A的范围。

Answer 1

模块可以导出一个默认对象和许多命名项。

这是默认模块导出：

const MyClass = (props) => (
  <div/>
)

export default MyClass

我们可以像这样导入它：

import MyClass from "../actions"

大括号允许导出命名项，所以如果我们有这样的导出：

const myConst = "The Text"
const myHelper = (num) => 2*num

export default MyClass
export {myHelper, myConst}

我们可以像这样导入：

import MyClass, {myHelper, myConst} from "../actions"

不需要在路径中添加索引 - 默认情况下是添加。所以写＆＃34; ../ actions＆＃34;足够而不是＆＃34; ../ actions / index＆＃34;

因此我们可以互相导入两个模块的任何导出元素。

出于测试目的，rewire模块有助于绕过导出限制。

编辑（评论后）：我尝试这样的代码：

# scope.js
var data = ['The data']
var value = 'The value'
var scope = this
var fn = function(){ return scope }
console.log(scope)
export { scope, value, fn }

# index.js
import { scope, fn } from './scope'
console.log(scope)
console.log(scope.data)
console.log(fn())

结果是：

{ a: [Getter], b: [Getter] }
{ a: [Getter], b: [Getter] }
undefined
{ a: [Getter], b: [Getter] }

在哪里＆＃39; a＆＃39;是scope变量，＆＃39; b＆＃39;是fn功能。所以包装似乎是孤立的。

使用`this`访问模块本地范围并将其传递给导入的模块

1 个答案: