Javascript Chrome扩展：未定义ReferenceError:$_Javascript_Jquery_Google Chrome_Google Chrome Extension

Javascript Chrome扩展：未定义ReferenceError:$

javascript jquery google-chrome google-chrome-extension

Javascript Chrome扩展：未定义ReferenceError:$,javascript,jquery,google-chrome,google-chrome-extension,Javascript,Jquery,Google Chrome,Google Chrome Extension,我对chrome扩展开发非常陌生，尝试在其中使用jquery和bootstrap。我总是犯这样的错误 ReferenceError:$未定义 Bootstrap的JavaScript需要jQuery。必须包括jQuery 在引导程序的JavaScript之前有人能帮我吗？我把Jquery放在引导之前，如果我在浏览器中运行它，我没有看到这个问题。不知道出了什么问题清单Json { "name": "Stocking", "versio

我对chrome扩展开发非常陌生，尝试在其中使用jquery和bootstrap。我总是犯这样的错误

ReferenceError:$未定义
Bootstrap的JavaScript需要jQuery。必须包括jQuery 在引导程序的JavaScript之前

有人能帮我吗？我把Jquery放在引导之前，如果我在浏览器中运行它，我没有看到这个问题。不知道出了什么问题

清单Json

{
"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
}

{
“名称”：“长袜”，
“版本”：“1.0.0”，
“描述”：“Chrome扩展以跟踪股票的实时运动”，
“清单版本”：2，
“icons”：{“128”：“icon/icon128.png”}，
“权限”：[
“标签”，
"

manifest.json中声明的

后台

脚本已经有了自己的页面，它运行的地方是一个隐藏的后台页面，因此您不应该将其加载到弹出窗口中，因为这毫无意义：当弹出窗口打开时，它会再次运行，并注册重复的事件侦听器，或者以其他方式执行在t中已经完成的重复工作他打开了背景页面。看。根据您实际想要做的事情，您可能根本不需要背景脚本

manifest.json中声明的

content\u脚本

已在匹配的网页中运行。网页与扩展弹出窗口在任何方面都不相关，它们是完全不同的网页，因此您不应该在弹出窗口中加载相同的内容脚本，因为这毫无意义。根据您实际想要做的事情，您可能无法加载根本不需要脚本

解决方案：不要在弹出窗口中加载background.js和content.js。编写并加载单独的popup.js

重要提示：弹出窗口是一个单独的窗口，因此它有自己的开发工具。右键单击弹出窗口内部并选择“检查”打开其开发工具。

感谢您的帮助！！您的解释非常好，问题已解决。

<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>