【问题标题】:ES6 and window / global variablesES6 和窗口/全局变量
【发布时间】:2017-03-24 18:55:54
【问题描述】:

我正在使用 es6 模块。在其中一些我使用 lodash。我的问题是 - 是否可以将 lodash 作为全局变量加载,或者应该分别在所有文件中导入?我在我的初始化程序中尝试了这个:

import lodash from 'lodash';
window._ = lodash;

也是这样:

window._ = require('lodash');

但它不起作用。在我的模块中,使用时出现错误,例如 _.truncate:

TypeError: 无法读取未定义的属性“截断”

【问题讨论】:

  • 我建议在所有文件中单独导入它。模块导入的目的是让你的依赖关系清晰。
  • 另外,如果您在多个脚本中包含模块,它会作为单例加载,因此您不会复制您的模块。

标签: webpack ecmascript-6 lodash vuejs2 vue-loader


【解决方案1】:

有 3 种方法可以让您看到您正在使用 webpack。

  1. window 对象仍然可用。就像您的示例一样,您需要确保首先加载初始化程序,然后您可以像以前一样将下划线附加到窗口对象,然后在您的模块中您可以将其用作window._.truncate。您可以看到这里的缺点是:1)存在加载顺序依赖性。 2) 对窗口对象存在依赖关系。 3) 用法不好。

  2. 您可以直接为需要的模块导入underscore

  3. 使用webpack,你可以通过定义插件https://webpack.js.org/plugins/define-plugin/来定义全局变量,然后在每个模块中你可以随意使用_.truncate

如果您只是偶尔需要该模块,那么#2 是可行的方法。如果您希望经常使用它,那么#3 会更方便。 #1 总是丑陋的,但在极少数情况下,这种解决方法可能会有所帮助,尽管您的情况显然不是。

【讨论】: