我真的是chrome扩展开发的新手，尝试在其中使用jquery和bootstrap。我一直有类似的错误
ReferenceError：未定义$
Bootstrap的JavaScript需要jQuery。在Bootstrap的JavaScript之前必须包含jQuery。
有人可以帮我吗？我将Jquery放在引导程序之前，并且如果在浏览器中运行它也没有看到该问题。.不知道出了什么问题？
清单杰森
{
"name": "Stocking",
"version": "1.0.0",
"description": "Chrome extention to keep tracks of stocks' real time movement",
"manifest_version": 2,
"icons":{"128":"icon/icon128.png"},
"permissions": [
"tabs",
"<all_urls>"],
"browser_action":{
"default_icon":{
"16":"icon/icon16.png",
"24":"icon/icon24.png",
"32": "icon/icon32.png"},
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"bootstrap-4.4.1-dist/js/jquery-3.3.1.slim.min.js",
"bootstrap-4.4.1-dist/js/bootstrap.bundle.min.js",
"content.js"],
"css":[
"bootstrap-4.4.1-dist/css/bootstrap.min.css"
]
}
],
"background":{
"scripts": [
"bootstrap-4.4.1-dist/js/jquery-3.3.1.slim.min.js",
"bootstrap-4.4.1-dist/js/bootstrap.bundle.min.js",
"background.js"],
"persistent": false
}
弹出窗口，html
<body>
<!-- Stocks -->
<div class="btn-group dropleft">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
Dropdown button
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
<!--Search box-->
<div>
<input type="text" name="tickerInput" placeholder="Search ticker symbols...">
<button type="submit" name="add"><i class="fas fa-plus"></i></button>
</div>
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="bootstrap-4.4.1-dist/js/jquery-3.3.1.slim.min.js"></script>
<script src="bootstrap-4.4.1-dist/js/bootstrap.bundle.min.js"></script>
<!-- My JavaScript -->
<script src="js/background.js"></script>
<script src="js/content.js"></script>
background在manifest.json中声明的脚本已经有自己的页面，该脚本在其中运行时是隐藏的背景页面，因此您不应该在弹出窗口中加载该脚本，因为这没有任何意义：当弹出窗口打开并注册重复事件时，它将第二次运行侦听器或执行与后台页面已完成的工作相同的重复工作。请参阅访问扩展程序background.js的控制台和devtools。根据您实际想要执行的操作，您可能根本不需要后台脚本。
在content_scriptsmanifest.json中宣布匹配的网页已经在运行。网页在任何方面都与扩展弹出窗口无关，因为它们是完全不同的页面，因此您不应在弹出窗口中加载相同的内容脚本，因为这毫无意义。根据您实际要执行的操作，可能根本不需要content_scripts。
解决方案：不要在弹出窗口中加载background.js和content.js。编写并加载一个单独的popup.js。
重要：弹出窗口是一个单独的窗口，因此它具有自己的devtools。在弹出窗口中右键单击，然后选择“检查”以打开其devtools。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句