javascript - 从ember组件引用全局库

我正在使用ember-remarkable，因为我想将markdown解析和语法高亮都添加到我的项目中。它唯一缺少的是行号，我想通过使用以下库来添加：highlightjs-line-numbers.js

我用以下内容覆盖了ember-remarkable的md-text组件：

import MDTextComponent from 'ember-remarkable/components/md-text';

export default MDTextComponent.extend({
  tagName: null,

  didRender() {
    this._super(...arguments);

    this.$("code[class*='language-']").each((i, block) => {
      this.$(block).addClass('hljs');
      hljs.lineNumbersBlock(block);
    });
  }
});

一切正常！但是，我的编辑者抱怨说，即使hljs在页面上可用，也没有定义。

如何避免此错误？

最佳答案

如果是ES6模块，则将其导入。否则，您可以将其用作window.hljs。

在浏览器中运行js代码时，window是全局变量的根。因此，您可以作为window.hljs访问它。

如果在Fastboot中运行代码，这应该是访问全局对象的更好方法：(window || Fastboot || global).hljs。

另一方面，除了使用全局对象容器，您还可以防止linter出现此错误。对于eslint，请参阅以下配置：Specifying Globals。