chrome.extension.executeScript（代码:)工作，但没有（file :)

Question

我正在尝试对具有弹出窗口的chrome进行扩展， 在弹出窗口我有一个按钮，按下时，在黑色div中添加一个黑色div 当前标签正文。

所以在我的popup.html中，theres链接到jquery和我的popup.js。我还有content_scripts，它在当前浏览器选项卡中加载jquery

popup.js的代码：

   $('div.enable').on('click', function(){
 chrome.tabs.executeScript(null,
     { code : "$('body').append('<div class="test"></div>');"} );
   });

这是有效的，但如果我尝试将我的代码放在外部文件中，如下所示：

popup.js：

      $('div.enable').on('click', function(){
           chrome.tabs.executeScript(null,
             { file : "manipulateDOM.js"} );
           });

manipulateDOM.js：

       $('body').append('<div class="test"></div>');

我无法让它工作，所有文件都在扩展的根目录。我看不出我错过了什么。而且我想理解

*********** 编辑 **************

我会尝试制作一个git来更好地解释问题

再次感谢