在 MediaWiki 扩展中加载 js 不起作用答案

【问题标题】：Loading of js in MediaWiki extension doesn't work在 MediaWiki 扩展中加载 js 不起作用
【发布时间】：2018-12-07 20:54:40
【问题描述】：

我即将为MediaWiki 创建一个扩展，我想在其中提供一个显示表单的特殊页面。对于这种形式，我想使用包括 jquery 和 popper.js 的 Bootstrap。因此我需要在 Extension 中包含 js 文件。

通常样式和脚本文件都包含在extension.json 中，如下所示：

"ResourceModules": {
"ext.meForm.custom": {
  "position": "top",
  "scripts": [
    "jquery-3.3.1.slim.min.js",
    "popper.min.js",
    "bootstrap.min.js",
    "ext.meForm.custom.js"
  ],
  "styles": [
    "bootstrap.min.css",
    "icons.css",
    "ext.meForm.custom.css"
  ]
}

然后他们需要在特殊页面中加载execution方法如下：

$output->addModuleScripts('ext.meForm.custom');
$output->addModuleStyles('ext.meForm.custom');

当我只包含样式文件时（只需删除scripts 属性），样式就会按预期应用。但是当我添加scriptproperty 时，不仅没有应用脚本，而且不再应用样式。好像我在模块定义中做错了什么，但我不知道是什么。

有没有人有任何线索或想法？

您好，雅各布

编辑：我忘了提，它似乎与 jquery、popper 或 bootstrap 的 js 文件无关，因为当我只包含 ext.meForm.custom.js 时它的行为相同，实际上它只是一个空的 js 文件。

我得到的唯一控制台输出是来自第 1 行 load.php 的 SyntaxError: expected expression, got '<'。

我正在使用 Mediawiki 版本 1.30.1。

编辑：现在可以了。问题似乎是另一个在加载时出错的扩展。我真的不知道这会如何导致我的扩展无法正确加载模块，但确实如此。

【问题讨论】：

您的资源模块定义似乎是正确的，可能出错的是 Mediawiki 已经捆绑了 jQuery，因此您可能遇到了同时加载的两个 jquery 库的冲突。在不知道控制台输出的情况下很难为您提供帮助。
您好，感谢您的回复！我忘了说，它似乎与 jquery、popper 或 bootstrap 的 js 文件无关，因为当我只包含 ext.meForm.custom.js 时，它的行为是相同的，实际上它只是一个空的 js 文件。我得到的唯一控制台输出是来自第 1 行的load.php 的SyntaxError: expected expression, got '<'。我已将error_reporting( -1 ); 和ini_set( 'display_errors', 1 ); 添加到LocalSettings.php 的顶部。是否有更多选项可以获得更多输出？
这听起来你在资源解析过程中遇到了某种 PHP 异常，请尝试检查 devtools 控制台以查看 load.php 的实际输出
好的，我刚刚查看了load.php输出，发现错误输出不是我的扩展引起的，而是安装了另一个扩展。所以我从LocalSettings 和tada 中删除了这个：令人惊讶的是，我的扩展一切顺利。因此，这似乎是由 mediawikis 加载行为和另一个扩展的加载错误引起的错误。感谢您引导我走向正确的方向。

标签： javascript mediawiki mediawiki-extensions

【解决方案1】：

addModuleScripts 并不是很有用（也已弃用）。试试$output->addModule('ext.meForm.custom');。

【讨论】：

您好，感谢您的回复！我刚刚将执行方法从addModuleScripts 和addModuleStyles 更改为addModule。现在它仍然不起作用，但仅使用 css（从模块中删除 scripts 参数）也不再起作用。我正在使用 Mediawiki 1.30.1。有什么想法吗？
检查mw.loader.getModuleNames()是否返回模块，如果没有则模块定义有问题。如果它确实查看您是否可以使用mw.loader.using(<modulename>) 加载它。如果这导致 URL 被加载，请检查该 URL - 如果 JS 解析失败，它将包含错误消息。（通常你也应该在控制台上看到它，但谁知道......）
我已经打印了$output->getResourceLoader()->getModuleNames() 的结果。我的模块在这个列表中，所以定义似乎是正确的。我还打印了$output->getModules() 的结果，如果我使用$output->addModules('ext.meForm.custom'); 添加它，它是一个包含我的模块的数组。现在我不确定，mw.loader.using(<modulename>) 是什么意思？既然看起来像js，那应该怎么执行呢？通过$output->addScript()添加？我尝试执行相应的 PHP，但在 ResourceLoaderModule() 上没有方法 using()。感谢您的帮助！
就像我刚刚在上面写的一样，它现在可以工作了。问题是另一个扩展引起的加载错误。还是谢谢！
FWIW 这些是在 wiki 页面上从浏览器的开发者控制台执行的命令。

【解决方案2】：

现在可以了！

问题似乎是另一个扩展在加载时出错。我真的不知道这会如何导致我的扩展无法正确加载模块，但确实如此。

【讨论】：