如何从 jQuery 插件中隐藏 'require' 函数

Question

我正在使用 twism jQuery plugin，它在内部使用了 'require' 函数。这与 webpack 冲突，它定义了自己的 'require'，导致以下错误：

Uncaught TypeError: __webpack_require__(...).toUrl is not a function

违规代码是这一行：

 b = require.toUrl("twism").replace("jquery.twism", "maps/" + u);

如何在不修改代码的情况下将全局 webpack 功能与此代码隔离开来？

Answer 1

你能完全限定 require 调用吗？例如

 b = twism.require.toUrl("twism").replace("jquery.twism", "maps/" + u);

Answer 2

解决方案是在该行之前添加特定于 webpack 的处理程序：

if (typeof(__webpack_require__) === 'function') {
   // hack for webpack - ask it to copy the map being used to the build location
   const buildUrl = require('./maps/' + file);       
   url = buildUrl.default;
   // the following line is for debug and demonstration purpose
   console.log('Moved file to url: ', file, url);
}

并将原来的 if 替换为 else if 子句：

原文：

//hack for RequireJS/Bower
if (typeof(require) !== 'undefined' && settings.map != "custom") {
     b = require.toUrl("twism").replace("jquery.twism", "maps/" + u);

替换为：

else if (typeof(require) !== 'undefined' && settings.map != "custom") {
    //hack for RequireJS/Bower
    b = require.toUrl("twism").replace("jquery.twism", "maps/" + u);

我将此作为拉取请求发布到 twism 作者的 Github。

如何从 jQuery 插件中隐藏 'require' 函数

How to hide 'require' function from a jQuery plugin

javascript

jquery-plugins

symfony

webpack