1

当我将旧版 webapp 转换为基于 webpack 的应用程序时,它使用mCustomScrollbar。根据 mCustomScrollbar 的文档,使用 webpack 运行需要使用 imports-loader。但是 doc 中给出的语法与旧版本的 webpack 兼容,而不是与最新版本兼容。

根据imports-loader的文档,我无法添加malihu-custom-scrollbar-plugintest.modules-rules

{
    test: /jquery-mousewheel/, /* This works fine */
    use: [{
            loader: "imports-loader",
            options: {
                imports: {
                    moduleName: "jquery",
                    name: "$"
                },
                wrapper: "window",
                additionalCode:
                    "var define = false;"
            }
        }]
},
{
    test: /malihu-custom-scrollbar-plugin/, /* Not working */
    use: [{
            loader: "imports-loader",
            options: {
                imports: {
                    moduleName: "jquery",
                    name: "$"
                },
                wrapper: "window",
                additionalCode:
                    "var define = false;"
            }
        }]
}

给出以下错误,

ERROR in ./node_modules/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css 8:6
Module parse failed: 'import' and 'export' may only appear at the top level (8:6)
File was processed with these loaders:
 * ./node_modules/imports-loader/dist/cjs.js

我的 vendor.js 如下所示,

...
import "malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css";
...

import $ from "jquery";
window.jQuery = jQuery;
window.$ = $;

...
require("jquery-mousewheel")($);
require("malihu-custom-scrollbar-plugin")($);
...

那么如何让它工作以及如何在同一个导入加载器中组合两个模块,在我的例子中jquery-mousewheelmalihu-custom-scrollbar-plugin.

4

1 回答 1

0

由于.cssmCustomScrollbar 的文件与 webpack 的其他加载器产生了问题,因此将 imports-loader 配置内联添加到webpack 配置文件中vendor.js并从 webpack 配置文件中删除。

现在vendor.js看起来像下面,

...
import "malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css";
...

import $ from "jquery";
window.jQuery = jQuery;
window.$ = $;

...
require("imports-loader?wrapper=window&!jquery-mousewheel");
require("imports-loader?wrapper=window&!malihu-custom-scrollbar-plugin");
...

随着这个 mCustomScrollbar 开始工作,让我知道是否有更好的方法或者这是正确的方法。

于 2021-07-28T10:26:36.727 回答