Webpack 定义插件替换已评估但未注入

Question

我有 JS 库 foo，它是用 webpack 构建的，它包含并构建了 Phaser 3 库的源代码。 Phaser 3 使用 define 插件来排除自身的某些部分，例如将“typeof CANVAS_RENDERER”替换为 false.

我运行关注的问题是这个。当我在我的 webpack 配置中包含这个块时

    new webpack.DefinePlugin({
        "typeof CANVAS_RENDERER": JSON.stringify(false),
    }),

我得到的输出是这样的

if (typeof WEBGL_RENDERER && typeof CANVAS_RENDERER)
{}

if (typeof WEBGL_RENDERER && !typeof CANVAS_RENDERER)
{
    WebGLRenderer = __webpack_require__(/*! ../renderer/webgl/WebGLRenderer */ "../node_modules/phaser/src/renderer/webgl/WebGLRenderer.js");

    //  Force the type to WebGL, regardless what was requested
    config.renderType = CONST.WEBGL;

    game.renderer = new WebGLRenderer(game);
}

其中 typeof CANVAS_RENDERER 显然被评估为 false，因此函数体已被优化，但它没有替换原始语句，导致代码在其 [=22= 时进入空路径].

Answer 1

看来，如果插件无法解析 if 子句的每个部分，在你的情况下typeof WEBGL_RENDERER（因为这在 new webpack.DefinePlugin 中没有定义），它不解决其余部分。

换句话说，如果您在插件中定义两者，它应该可以工作：

new webpack.DefinePlugin({
    "typeof CANVAS_RENDERER": JSON.stringify(false),
    "typeof WEBGL_RENDERER": JSON.stringify(true),
}),

至少在我的测试设置中解决了所描述的问题。

Webpack 定义插件替换已评估但未注入

Webpack Define plugin replacement is evaluated but not injected

javascript

phaser-framework

webpack