cypress is not identifying a constructor

Question

Hi there I am trying to run a script in cypress by following page object model. But when I am running my script cypress is throwing error that page's _HomePage.HomePage is not a constructor
I am attaching my code below for reference.

In HomepageObject

class HomePage
{
   myaccountIcon(){
      return cy.get('a[title=Account] div.icon-wrapper.top-action-icons.quick-menu');
   }
   viewCartICon(){
      return cy.get('a[title=Cart]');
   }
   shortListIcon(){
      return cy.get('a[title=Shortlist]');
   }
   hamburgerIcon(){
      return cy.get('div.gc-icon-col.gc-icon-closed img[class=img-responsive]');
   }

    editNameField()
    {
       return cy.get('form > div:nth-child(1) > input');
    }
    editEmailField()
    {
      return cy.get('form > div:nth-child(2) > input');
    }
    editPasswordField()
    {
        return cy.get('form > div:nth-child(3) > input');
    }

    gettwoWayDataBinding()
    {

    }

    selctDropdown()
    {
       return cy.get("select");
    }

    gnavShop_option()
    {
       return cy.get('ul.navbar-nav  li:nth-child(2)');
    }
    sddCTA()
    {
      return cy.get('a.tile-8.sdd');
    }
      clickPersonalizedGnavSection(){
      return cy.get('#selection-panel > div > a.tile-8.personalized').click();
    }
    

}
export default HomePage;

in my script

///<reference types ="cypress"/>
import { HomePage } from '../support/pageObjects/HomePage';
import { MppPage } from '../support/pageObjects/OrderReviewPage';
describe("Testframwork", () => {
    let data1;
    before(function () {
        cy.log("Loading the fixure file")
        cy.fixture('example.json').then(function (data) {
            data1 = data;
        })
    })
    it("Checkout scenario", () => {
        const homePage = new HomePage();
        const mp = new MppPage();
        cy.visit('https://google.com');
        homePage.editNameField().type(data1.name);
        homePage.editEmailField().type(data1.email);
        homePage.editPasswordField().type(data1.password);
        homePage.selctDropdown().select(data1.gender);
        homePage.gnavShop_option().click();

        cy.get('.card-body h4').each(($el, index, list) => {
            if ($el.text().includes('Blackberry')) {
                cy.get('div.card-footer  button').eq(index).click();
            }

        })
        mp.getContinueCheckout().click();
    })
})

in my package.json file

{
  "name": "cypressautomation",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "satyajit",
  "license": "ISC",
  "devDependencies": {
    "@types/cypress-cucumber-preprocessor": "^4.0.1",
    "cypress": "^10.6.0",
    "cypress-cucumber-preprocessor": "^4.3.1",
    "mochawesome": "^7.1.3",
    "multiple-cucumber-html-reporter": "^1.21.6"
  },
  "cypress-cucumber-preprocessor": {
    "nonGlobalStepDefinitions": true,
    "cucumberJson": {
      "generate": true,
      "outputFolder": "cypress/cucumber-json",
      "filePrefix": "",
      "fileSuffix": ".cucumber"
    }
  }
}

and below I am attaching the screenshot of the error and other pictures for reference. please help me to solve this.