Typescript+Require.js+PIXI 6-import附加到窗口，但在主作用域中未定义

Question

我试图将一个项目从Pixi.js 5.3升级到6.0.0，但遇到了一个奇怪的问题。以前我使用///<reference types='pixi.js'/>只是为了让IDE识别Pixi类型。这似乎不再起作用，因为v6已经取消了PIXI命名空间。

尝试import * as PIXI from 'pixi.js'允许Typescript识别PIXI。但奇怪的是，PIXI被附加到window，而不是在导入它的模块中定义

这是我能想到的最简单的例子。PIXI像任何导入一样应该附加到Main并在Main中可用。有人能解释为什么PIXI在这里的表现与其他进口产品不同吗？

index.html:

<script data-main='main' src='require.js'/>

Main.ts:

import * as PIXI from 'pixi.js';
import * as FOO from 'Foo';
export class Main {
public constructor() {
console.log('window.PIXI',window.PIXI); //defined, contains all Pixi modules.
console.log('PIXI',PIXI); //undefined

console.log('window.FOO',window.FOO); //undefined
console.log('FOO',FOO); //defined.
}
}
new Main();

Main.js(AMD(

define(["require"，"exports"，"pixi.js"，"Foo"]，function(require，exports，pixi，Foo({"严格使用"；Object.defineProperty(导出，"__esModule"，｛value:true｝(；class Main{构造函数(({console.log('window.PIXI'，window.PIXI(//定义，包含所有Pixi模块。console.log(PIXI'，PIXI(//未定义的console.log('window.FOO'，window.FOO(//未定义的console.log('FOO'，FOO(//定义}}出口。Main=Main；new Main((；})

Foo.ts

export class Foo {}

Answer 1

我发现我需要在require.js配置中为pixi.js添加一个填充程序。这样，导入就可以正常工作(尽管PIXI仍然并且附加到window(。

require.config({
shim: {
'pixi.js': {
exports: 'PIXI'
}
}
});