如何使用MediaWiki扩展的CSS引用的图像资源?



问题

如何将图像添加到MediaWiki扩展中,使其可以由注册为ResourceModules的css文件引用?

我正在开发一个MediaWiki扩展,它利用第三方工具,我将该工具的副本作为扩展资源的一部分。

该工具有js和css,我包括如下:

...
"ResourceModules": {
"ext.leaflet": {
"scripts": "ext.leaflet/leaflet.js",
"styles": "ext.leaflet/leaflet.css"
}
},
...

第三方工具包括一个图像目录,其中包括leaflet.css引用的各种图像,但我不知道该把它放在哪里,MediaWiki将与CSS/JS一起提供服务。

图像url正在解析到{SERVER}/ext.leaflet/images/marker-icon.png

您可以将图像资源放在扩展文件夹中的图像文件夹中,并以相对方式在CSS中引用它。

看一下Echo扩展,例如:

在css

中像这样引用图像background-image: url( ../../images/pending.gif );

https://github.com/wikimedia/mediawiki-extensions-Echo/search?q=pending.gif

存储在这里:{SERVER}/extensions/Echo/images

https://github.com/wikimedia/mediawiki-extensions-Echo/tree/master/images

CSS在这一行被注册为ResourceModule

https://github.com/wikimedia/mediawiki-extensions-Echo/blob/97771e3369b7949db242f72551ac6efe803881e5/extension.json L460

在你的JS中,你可以使用mw.config.get('wgExtensionAssetsPath')在我的情况下,这返回/extensions

最新更新