Node Version Compatibility Issue with @prismatic-io/embedded

NomanJafar commented 1 month ago

Node Version Compatibility Issue with @prismatic-io/embedded

Environment:

Node.js version: 16.9.1
Package Version: @prismatic-io/embedded
React App Dependencies: (include a JSON snippet of your package.json as above)

Issue:

While running yarn add @prismatic-io/embedded, we encounter the following error:

**error jest-mock@29.7.0: The engine "node" is incompatible with this module. Expected version "^14.15.0 || ^16.10.0 || >=18.0.0". Got "16.9.1"
error Found incompatible module.**

We do not experience this error while installing other dependencies. I have tried removing node modules and installing all the existing dependencies but did not find any error. I installed some other new dependencies to check but did not find any issues in those. That means the issue only occurs while installing Prismatic.

Steps to Reproduce:

Set up a React project with Node.js 16.9.1.
Use the attached package.json in place of package.json present in the new React project.
Run yarn add @prismatic-io/embedded.

Attempts to Resolve:

Upgrading Node.js to 16.20.2 resolves the issue, but we cannot upgrade our Node.js version due to other constraints.
Added .yarnrc to ignore engines, but seeking a more sustainable solution.

Could you please clarify the Node.js versions officially supported by Prismatic and suggest any workarounds for this compatibility issue with Node.js 16.9.1?

Package.json { "name": "@tt/core", "version": "3.0.5", "private": true, "dependencies": { "@ant-design/charts": "^1.4.2", "@ant-design/icons": "4.0.0", "@dnd-kit/core": "^6.1.0", "@dnd-kit/modifiers": "^7.0.0", "@dnd-kit/sortable": "^8.0.0", "@dnd-kit/utilities": "^3.2.2", "@glidejs/glide": "^3.4.1", "@lourenci/react-kanban": "^2.0.0", "@material-ui/core": "^4.11.0", "@microsoft/signalr": "^3.1.8", "@progress/kendo-data-query": "1.5.4", "@progress/kendo-drawing": "1.9.3", "@progress/kendo-licensing": "1.1.3", "@progress/kendo-react-animation": "4.3.0", "@progress/kendo-react-buttons": "^4.3.0", "@progress/kendo-react-data-tools": "4.3.0", "@progress/kendo-react-dateinputs": "4.3.0", "@progress/kendo-react-dropdowns": "4.3.0", "@progress/kendo-react-grid": "3.18.0", "@progress/kendo-react-inputs": "4.3.0", "@progress/kendo-react-intl": "3.18.0", "@progress/kendo-react-pdf": "3.18.0", "@progress/kendo-react-popup": "4.3.0", "@progress/kendo-react-treeview": "^4.3.0", "@redq/js-info-bubble": "^0.8.1", "@uppy/core": "^1.5.1", "@uppy/dropbox": "^1.3.2", "@uppy/google-drive": "^1.3.2", "@uppy/instagram": "^1.3.2", "@uppy/react": "^1.3.2", "@uppy/tus": "^1.4.2", "antd": "^4.9.4", "antd-local-icon": "^0.1.3", "apexcharts": "^3.23.1", "auth0-lock": "^11.17.3", "axios": "^0.19.2", "c3": "^0.7.20", "card-react": "^1.2.7", "chart.js": "^2.8.0", "classnames": "^2.2.6", "clone": "^2.1.2", "common-tags": "^1.8.0", "d3": "^4.9.1", "d3-array": "^1.2.0", "d3-axis": "^1.0.7", "d3-scale": "^1.0.6", "d3-selection": "^1.1.0", "d3-shape": "^1.3.5", "d3-time": "^1.0.6", "d3-time-format": "^2.0.5", "d3-tip": "^0.7.1", "d3-zoom": "^1.2.0", "enzyme-adapter-react-16": "^1.14.0", "enzyme-react-intl": "^2.0.6", "eslint": "7.10.0", "eslint-plugin-prettier": "^3.1.4", "express": "^4.17.1", "firebase": "^7.2.0", "formik": "^1.5.8", "frappe-charts": "^0.0.8", "fuse.js": "^3.4.5", "globalize": "^1.4.2", "highcharts": "^8.2.2", "highcharts-react-official": "^3.0.0", "history": "^4.10.1", "html2canvas": "^1.0.0-rc.7", "immutable": "^4.0.0-rc.12", "jquery": "^3.5.1", "js-rich-marker": "^1.1.2", "jspdf": "^2.3.1", "leaflet": "^1.5.1", "lodash": "^4.17.15", "mapbox-gl": "^2.0.1", "moment": "^2.27.0", "msal": "^1.4.1", "node-sass": "^7.0.1", "nprogress": "^0.2.0", "powerbi-client-react": "^1.3.3", "prop-types": "^15.7.2", "react": "^18.2.0", "react-addons-shallow-compare": "^15.6.2", "react-apexcharts": "^1.3.7", "react-big-calendar": "^0.22.1", "react-chartjs-2": "^2.7.6", "react-codemirror": "^1.0.0", "react-count-down": "^1.2.1", "react-credit-cards": "^0.8.0", "react-csv-downloader": "^2.2.0", "react-custom-scrollbars": "^4.2.1", "react-dates": "^21.2.0", "react-dnd": "^7.4.5", "react-dnd-html5-backend": "^7.4.4", "react-dom": "^18.2.0", "react-drawer": "^1.3.4", "react-dropzone-component": "^3.2.0", "react-element-resize": "^0.2.2", "react-error-overlay": "^6.0.3", "react-flexbox-grid": "^2.1.2", "react-flip-move": "^3.0.3", "react-google-charts": "^3.0.15", "react-grid-layout": "^0.16.6", "react-heatmap-grid": "^0.8.2", "react-highlight-words": "^0.17.0", "react-icons": "^3.7.0", "react-id-swiper": "^2.3.2", "react-instantsearch": "^4.3.0", "react-intl": "^2.9.0", "react-leader-line": "^1.0.5", "react-loadable": "^5.5.0", "react-map-gl": "^5.3.14", "react-motion-drawer": "^3.1.0", "react-perfect-scrollbar": "^1.5.3", "react-placeholder": "^3.0.2", "react-quill": "^1.3.3", "react-redux": "^7.1.1", "react-router": "^5.1.2", "react-router-dom": "^5.1.2", "react-scripts": "^3.2.0", "react-select": "^3.1.0", "react-sidebar": "^3.0.2", "react-speech-recognition": "^2.0.4", "react-tag-input": "^6.4.1", "react-throttle": "^0.3.0", "react-to-print": "^2.14.13", "react-trello": "^2.2.8", "react-trend": "^1.2.5", "react-vis": "^1.11.7", "react-youtube": "^7.9.0", "recharts": "^1.8.5", "redux": "^4.0.4", "redux-devtools": "^3.5.0", "redux-devtools-dock-monitor": "^1.1.3", "redux-devtools-log-monitor": "^1.4.0", "redux-saga": "^1.1.1", "redux-saga-firebase": "^0.15.0", "redux-thunk": "^2.3.0", "reselect": "^4.0.0", "rheostat": "^3.0.2", "rich-marker": "^0.0.1", "styled-components": "^4.4.0", "styled-theme": "^0.3.3", "swiper": "^5.0.4", "use-debounce": "^3.4.2", "worker-loader": "^3.0.7" }, "devDependencies": { "babel-plugin-import": "^1.12.2", "customize-cra": "^0.8.0", "enzyme": "^3.10.0", "enzyme-to-json": "^3.4.2", "react-app-rewired": "^2.1.4", "redux-mock-store": "^1.5.3" }, "scripts": { "start": "cross-env PORT=3000 react-app-rewired start", "build": "react-app-rewired build", "serve": "serve -s build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all", "iOS 7", "last 2 iOS major versions" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 2 safari version", "last 2 iOS major versions" ] } }

taylorreece commented 1 month ago

Hi @NomanJafar ,

Thanks for your note.

We officially support actively maintained versions of NodeJS. A release schedule for NodeJS is available on GitHub https://github.com/nodejs/release#release-schedule. Node 16.x was EOL'd in September last year (though, the embedded SDK likely still works with more recent versions of 16.x).

In your case it appears that a downstream dependency (jest-mock which is pulled in via @prismatic-io/spectral) requires a NodeJS version of 16.10.0 or greater when using 16.x. Luckily, it doesn't appear that this dependency is directly referenced in from the embedded library. You have a couple of options to address this issue:

You noted that you cannot update to 16.20.x - can your project be upgraded to 16.10.x? There may be fewer hurdles when bumping just one minor version.
You can add @prismatic-io/embedded with an --ignore-engines flag. i.e. yarn add @prismatic-io/embedded --ignore-engines. That will instruct yarn to ignore engine requirements. A CI/CD pipeline, then, can use the same flag - yarn install --ignore-engines when installing requirements.

NomanJafar commented 1 month ago

Hi @taylorreece , Thanks for the help we have just upgraded the version to 16.10, and it has started to work. thank you.

prismatic-io / embedded