Help Required For Webpack Please

I am trying to get a UXP plugin to store data on a Firebase Database.

Having read all the docs and followed the instructions on installing Firebase using npm I am falling at the first fence.

To initialize Firebase you have to add something like this…

import {
} from 'firebase/app';

Now this is throwing an error in the console … Cannot use import statement outside a module

After digging around, I realize that Import is not allowed in UXP and Webpack is needed, which is where I am completely stuck.

I have or at least I think I have installed Webpack by using npm install webpack --save-dev which has been detected by the pacjage.json file

  "name": "uxp-template-ps-starter",
  "version": "1.0.0",
  "description": "Starter template for creating Adobe UXP based photoshop plugin.",
  "author": "Adobe Inc",
  "license": "Apache-2.0",
  "devDependencies": {
    "webpack": "^5.53.0"
  "dependencies": {
    "firebase": "^9.0.2"

I am not sure how to proceed from here. All the docs I have read are for regular html useage and not UXP.

If anyone is prepared to walk me through getting this working, it would be extremely appreciated.

With UXP instead of import try using require syntax (something related to some versions IIRC - was looking into this when started using Webpack)

const {someVar} = require('some/app');