我尝试在我的chrome扩展上使用firebase进行身份验证，但我收到了关于以下内容的错误
未捕获的语法错误：不能在模块外部使用import语句
搜索后，我被告知，我将需要捆绑我的应用程序，以便能够使用导入语句
在安装webpack，配置和运行npm run build时，我的service_worker和内容脚本与我的popup.js文件失去了通信。发送到文件中的所有消息都不起作用。
这是我的webpack.config.js设置

const path = require('path');

module.exports = {
  // The entry point file described above
  entry:{
    background: './background.js',
    content: './index.js'
  },
  // The location of the build folder described above
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].js',
  },
  // Optional and for development only. This provides the ability to
  // map the built code back to the original source format when debugging.
  devtool: 'eval-source-map',
};

index.html链接到javascript文件

<script src="./dist/content.js"></script>

请问我做错了什么？这是我第一次既使用webpack又配置chrome扩展。
注意：我的index.html被声明为web_accessible_resource文件，并使用iframe注入到网页中。只是为了给这个问题提供更多的上下文。