来自另一个文件的 systemjs 变量

Question

我的项目中有两个 javascript 文件。一个 (index.js) 声明 Material 对象，另一个 (nav.js) 向 Material.

添加一个方法

我正在使用 SystemJS 将这两个导入我的 HTML 页面。

当页面加载时，我从第二个文件中收到一条错误消息，指出 Material 未定义。

如果我像这样先加载第一个文件再加载第二个文件：

<script src="./jspm_packages/system.js"></script>
<script src="./config.js"></script>
<script>
    System.import("./scripts/index.js");
    System.import("./scripts/nav.js");
</script>

Material 对象不应该已经被定义了吗？

这是我的两个文件：

index.js:

var $ = require('jquery');

// Define Material
var Material = {
  components: {},
  reload: function () {
    console.log('reloading...');
  },
  dev: true
};

和nav.js：

var $ = require('jquery');

Material.initHeader = function () {
  console.log('initializing header...');
};

这是我遇到的错误

Uncaught ReferenceError: Material is not defined at nav.js:3

有什么帮助吗？

Answer 1

模块是独立的。它们在加载时不会修改全局命名空间。如果你想要其他模块的东西，你必须导入它：

var $ = require('jquery');
var ix = require('./index.js');

ix.Material.initHeader = function () {
  console.log('initializing header...');
};

来自另一个文件的 systemjs 变量

systemjs variable from another file

javascript

systemjs

jspm