Converting Scripts into a ES6 Module in A Chrome Extension

12 Views Asked by At

I am developing a chrome extension that can autofill forms of a particular website. I want to store some data in Firestore and access it while filling forms. The problem comes when I try to import using

import { initializeApp } from "https://www.gstatic.com/firebasejs/10.9.0/firebase-app.js";
import { getFirestore } from 'https://www.gstatic.com/firebasejs/10.9.0/firebase-firestore.js'

I keep getting the error "Cannot use import statement outside a module."

All my firestore stuff is set up and I have tried adding "type" = "module" in my Manifest.json but nothing seems to work. How can I use any libraries without being able to import a module?

This is my Manifest.json

{
    "manifest_version": 3,
    "name": "XXX",
    "description": "Base Level Extension",
    "version": "1.0",
   
    "action": {
      "default_popup": "index.html",
      "default_icon": "images.png"
    
    },
    "background": {
        "type":"module",
        "service_worker": "background/background.js"

      }, 
      "content_scripts": [
        
        {
            "matches":["XXX"],
            "js":["content_scripts/landing_page.js"],
            "type":"module"
        },
        {
          "matches":["XXX"],
          "js":[{"type": "content_scripts/login_page.js"}],
          "type":"module"
      }
      ]
  }

Can background scripts be ES modules?

0

There are 0 best solutions below