Hello folks, Export functionality is working on local but not working on server why this is happening I don't understand ?

[prasadaher1999]

generateExcelFile(res: any[]){ var response = res[0]; const workbook = new ExcelJS.Workbook();

//#region Common COC Worksheet
const commonCoCWorksheet = workbook.addWorksheet('worksheetA');
const commonCoCHeaders =['test1','test2','test3'];

const commonDtRow = commonCoCWorksheet.addRow(commonCoCHeaders);

commonDtRow.eachCell((cell) => {
  cell.style = {
    font : {bold: true},
    fill: {
      type: 'pattern',
      pattern: 'solid',
      fgColor: { argb: 'FFFFC000' },
      bgColor: { argb: 'FFFFC000' }
    }
  };
});

const CommonCoCRows = response['commondatas'].map((row) => [row.test1,row.test2,row.test3]);

  commonCoCWorksheet.addRows(CommonCoCRows);

  commonCoCWorksheet.columns.forEach((column) => {
    const values = column.values.map((cell) => cell.toString());
    //const maxLength = Math.max(...values.map(value => value.length));
    const maxLength = Math.max(...values.filter(str => typeof str === 'string' && str.length > 0).map(str => str.length));
    column.width = maxLength + 5;
  });


//#endregion


workbook.xlsx.writeBuffer().then((data:any) => {
  console.log("workbook data lpgdom :", data);
  const blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
  console.log("workbook blob");
  FileSaver.saveAs(blob, 'test.xlsx');
});

}

[Shahekta51995]

I am also facing the same issue. For me, It was working before some days. Now suddenly it stops. https://github.com/exceljs/exceljs/discussions/2550#discussion-5707781

[chetanclozio]

@guyonroche @alubbe Hi Guys, Good morning!. I am also facing the same issue as reported by @prasadaher1999 Can you please help us to solve this item? It's wired behavoiur like code is working correctly on local and after deployment on server it is not working.

[arjay-dala]

Same I am having this error "Cannot call a class as a function" when using const workbook = new ExcelJS.Workbook()

[arjay-dala]

Same I am having this error "Cannot call a class as a function" when using const workbook = new ExcelJS.Workbook()

It is working on development side, but when building in production this error occurs

[jack-robson]

Hey everyone 👋

Any got steps to replicate this issue?

Eager to write a patch, but haven't been able to trigger the error.

[stx-chris]

Sure:

1. Install latest next.js (13.5.3 and above)
2. add a react-component using import { Workbook } from "exceljs"
3. call const workbook = new Workbook();
4. Make sure it doesn't cause an error when running yarn dev
5. Build the production version yarn build and start the build locally yarn start

The error now appears when visiting the page. As mentioned in #2557 , a workaround is currently to use react-use-exceljs, which lazily loads the libraries.

[vinz-mehra]

I am also facing this issue. I can't use the react-use-exceljs wrapper as I primarily use this package to read Excel files and have no idea how to migrate in my case

[jack-robson]

Unfortunately, I was still unable to replicate this issue.

I created a new next app and made page.tsx the following:

import { Workbook } from "exceljs";

export default function Home() {
  const workbook = new Workbook();
  return <main>Home</main>;
}

With my package.json looking like

{
  "name": "next-playground",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "exceljs": "^4.3.0",
    "next": "13.5.3",
    "react": "^18",
    "react-dom": "^18"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "autoprefixer": "^10",
    "eslint": "^8",
    "eslint-config-next": "13.5.5",
    "postcss": "^8",
    "tailwindcss": "^3",
    "typescript": "^5"
  }
}

[eeulogi1999]

Desafortunadamente, todavía no puedo replicar este problema.

Creé una nueva aplicación siguiente e hice que page.tsx fuera lo siguiente:

import { Workbook } from "exceljs";

export default function Home() {
  const workbook = new Workbook();
  return <main>Home</main>;
}

Con mi paquete.json luciendo así

{
  "name": "next-playground",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "exceljs": "^4.3.0",
    "next": "13.5.3",
    "react": "^18",
    "react-dom": "^18"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "autoprefixer": "^10",
    "eslint": "^8",
    "eslint-config-next": "13.5.5",
    "postcss": "^8",
    "tailwindcss": "^3",
    "typescript": "^5"
  }
}

pruebe con 13.5.4 o 13.5.5

[lss3070]

I raised the version to 4.4 and it worked

[MJsuriya]

@lss3070 @stx-chris Thank you. 🙏🏽

The combination of both solutions worked in my case. Yes, our site using Exceljs lib.

I had been struggling with this for the past two days, and finally, the site is working on the server.

The problem I encountered was upgrading Next.js from v13.4.2 to v14.1.4 (the latest version).

An error was appearing on the console: "Cannot call a class as a function".