如何在模块中使用matter.js

Question

这里是初学者问题。我需要将 Matter.js 实现到模块内构建的项目中。当我尝试像这样的简单导入时：

import  "./matter.js";

我收到以下错误：

Uncaught TypeError: Cannot set property 'Matter' of undefined
    at webpackUniversalModuleDefinition (VM609 matter.js:36)
    at VM609 matter.js:37

执行此操作的正确方法是什么？抱歉，如果这是一个新手问题。只是到处找不到答案。

Answer 1

将 Matter.js 文件中的第 37 行替换为

})(this || window, function() {

而不是

})(this, function() {

然后就说

import './matter.js';

Matter.whatever;

似乎至少对我有用！

Answer 2

ESM 构建

虽然Joseph Coppin的答案有效，但我发现它令人沮丧，因为它会污染浏览器

window

并且在升级时需要手动编辑。

幸运的是，经过一番搜索后，我发现 Matter.JS 现在有一个实际的 ESM 版本，您可以通过 jsDelivr 上的切换来选择它！

import Matter from 'https://cdn.jsdelivr.net/npm/[email protected]/+esm'

效果很好，我只需下载该文件并将其放入我的项目目录中即可。这样，它甚至可以在本地托管，例如。

import Matter from './matter.esm.js'