Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/362.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 捆绑的Webextension没有';我看不到JQuery_Javascript_Webpack_Google Chrome Extension_Browserify_Parceljs - Fatal编程技术网

Javascript 捆绑的Webextension没有';我看不到JQuery

Javascript 捆绑的Webextension没有';我看不到JQuery,javascript,webpack,google-chrome-extension,browserify,parceljs,Javascript,Webpack,Google Chrome Extension,Browserify,Parceljs,我正在为Chrome创建webextension,以下代码导致错误: $(function () { $('[data-toggle="popover"]').popover(); // ... }); Chrome抱怨说: 未捕获的TypeError:jquery_1.默认值(…)。popover不是函数 看起来引导程序根本不可用。我知道脚本的导入顺序很重要: 因此,我确保在编写代码之前包含引导: "content_scripts": [ { "js": [

我正在为Chrome创建webextension,以下代码导致错误:

$(function () {
  $('[data-toggle="popover"]').popover();
  // ...
});
Chrome抱怨说:

未捕获的TypeError:jquery_1.默认值(…)。popover不是函数

看起来引导程序根本不可用。我知道脚本的导入顺序很重要:

因此,我确保在编写代码之前包含引导:

"content_scripts": [
    {
        "js": [
            "assets/jquery/dist/jquery.min.js",
            "assets/popper.js/dist/popper.min.js",
            "assets/bootstrap/dist/js/bootstrap.min.js",
            "content/index.js"
        ],
        "css": [
            "assets/css/extra.css",
            "assets/bootstrap/dist/css/bootstrap.min.css"
        ]
    }
],
这些脚本路径是有效的

编辑:

对不起,我把这个bug的文档弄乱了。 显然,这只发生在我使用捆绑机时,比如包裹。
我只使用parcel进行了测试,但我相信任何捆绑管理器(如webpack或browserify)都会出现此问题。

我在使用Bootstrap 4时遇到同样的问题,它在Bootstrap v.3.3.7上运行良好,但我无法使其正常工作,但最终我还是做到了。这就是我所做的:

CDN订单:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
HTML示例:

<a href="#" title="Header" data-toggle="popover" data-placement="bottom" data-content="Content">Bottom</a>

希望这有帮助-如果没有,请告诉我。

我在使用Bootstrap 4时遇到了同样的问题,它在Bootstrap v.3.3.7上运行良好,但我无法使它工作,最终我还是做到了。这就是我所做的:

CDN订单:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
HTML示例:

<a href="#" title="Header" data-toggle="popover" data-placement="bottom" data-content="Content">Bottom</a>

希望这能有所帮助-当使用捆绑程序(如parcel)处理依赖项时,如果没有,请告诉我,jQuery是在带有CommonJS模块的环境中执行的

在这种设置中,jQuery不会将自己添加到全局
窗口
对象中。但是,bootstrap需要
$
函数和
窗口上的
jQuery

解决方案是手动添加,下面是typescript代码。在JS中,您不需要对
any

import $ from "jquery";
(<any>window).jQuery=$;
(<any>window).$=$;
import "bootstrap";
从“jquery”导入$;
(window.jQuery=$;
(窗口)。$=$;
导入“引导”;

使用捆绑程序(如parcel)处理依赖关系时,jQuery是在具有CommonJS模块的环境中执行的

在这种设置中,jQuery不会将自己添加到全局
窗口
对象中。但是,bootstrap需要
$
函数和
窗口上的
jQuery

解决方案是手动添加,下面是typescript代码。在JS中,您不需要对
any

import $ from "jquery";
(<any>window).jQuery=$;
(<any>window).$=$;
import "bootstrap";
从“jquery”导入$;
(window.jQuery=$;
(窗口)。$=$;
导入“引导”;
文档中说“弹出窗口需要工具提示插件作为依赖项”。文档中说“弹出窗口需要工具提示插件作为依赖项”。