Home Forums Chart Support Chart not work with Next JS

Chart not work with Next JS

Viewing 4 posts - 1 through 4 (of 4 total)
  • #43614

    I am using canvas js with next Js, and I am getting the below error while building the next js page.

    export default CanvasJSReact;

    SyntaxError: Unexpected token ‘export’
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1176:20)
    at Module._compile (node:internal/modules/cjs/loader:1218:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
    at Module.load (node:internal/modules/cjs/loader:1117:32)
    at Module._load (node:internal/modules/cjs/loader:958:12)
    at Module.require (node:internal/modules/cjs/loader:1141:19)
    at require (node:internal/modules/cjs/helpers:110:18)
    at @canvasjs/react-charts (/home/web-admin/.next/server/pages/ecg.js:52:18)
    at __webpack_require__ (/home/web-admin/.next/server/webpack-runtime.js:33:42) {
    page: ‘/’

    My app in with React version 17.0.2


    I also tried it with latest versions

    “name”: “ecg-chart”,
    “version”: “0.1.0”,
    “private”: true,
    “scripts”: {
    “dev”: “next dev”,
    “build”: “next build”,
    “start”: “next start”,
    “lint”: “next lint”
    “dependencies”: {
    “@canvasjs/react-charts”: “^1.0.0”,
    “@emotion/react”: “^11.11.1”,
    “@emotion/styled”: “^11.11.0”,
    “@mui/material”: “^5.14.5”,
    “eslint”: “8.47.0”,
    “eslint-config-next”: “13.4.19”,
    “formik”: “^2.4.3”,
    “next”: “13.4.19”,
    “react”: “18.2.0”,
    “react-dom”: “18.2.0”,
    “yup”: “^1.2.0”



    CanvasJS seems to be working fine with Next.js. Please take a look at this sample project for integration of CanvasJS Charts with Next.js.

    If you are still facing the issue, kindly create sample project reproducing the issue you are facing and share it with us over Google-Drive or Onedrive so that we can look into your code, run it locally at our end to understand the scenario better and help you out.

    Basic Column Chart in Next.js

    Manoj Mohan
    Team CanvasJS


    @Manoj Mohan

    Thanks For the solution it works for me. :)

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.