javascript - 将第三方库添加到 Chrome 扩展时遇到问题

Question

问题

我正在尝试将第三方库添加到我正在构建的 Chrome 扩展中。我正在尝试动态添加脚本。我下载了jquery并将其添加到项目中。然后我尝试使用jquery动态添加p5.min.js和p5.dom.min.js。

• 出现错误。

Image of error message -- p5.dom.min.js 已加载，但 p5.min.js 未加载？

代码

• 在manifest.json中:

  "js": [
                   "jquery-3.2.1.min.js", "content2.js"
              ],
  

• 在 content2.js 中:

  var script1 = document.createElement('script');
  script1.src = 'jquery-3.2.1.min.js';
  document.getElementsByTagName('head')[0].appendChild(script1);
  
  $('head').append("<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.min.js'>");
  $('head').append("<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.dom.min.js'>");
  
  var s = function(sketch){
    //lotsa code.
  }
  
  
  var myp5 = new p5(s);
  

注释

• 我还尝试下载p5.min.js和p5.dom.min.js并将其直接添加到项目和manifest.json文件中，但这也不起作用
  • https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.min.js
  • https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.dom.min.js
• 我还观看了 Daniel Schiffman(编码列车)在 chrome extensions 中使用 p5.js 的视频。然而，当我尝试模仿他的视频时，我仍然遇到错误。

Answer 1

你不需要jquery。你在哪里...

 script1.type='text/javascript';

您可能还想考虑...

 script1.async=true;

对于即时测试，您还可以包括...

 script1.onload=function(){alert('Script loaded!');};