search

CarlosNZ / json-edit-react

React component for editing/viewing JSON/object data
https://carlosnz.github.io/json-edit-react/
MIT License
172 stars 16 forks source link

Reference error while building in azure pipeline #120

Open JoelGeorge693 opened 1 month ago

JoelGeorge693 commented 1 month ago

ReferenceError: require is not defined in ES module scope, you can use import instead This file is being treated as an ES module because it has a '.js' file extension and '/home/vsts/work/1/s/node_modules/json-edit-react/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension. at file:///home/vsts/work/1/s/node_modules/json-edit-react/build/index.cjs.js:1:20 at ModuleJob.run (node:internal/modules/esm/module_job:234:25) at async ModuleLoader.import (node:internal/modules/esm/loader:473:24)

I am facing this error when I am my azure pipeline is building the application. It would be of great help if someone could guide me to a solution.

CarlosNZ commented 1 month ago

Are you using the latest version (1.16.0) ? If so, can you try with one of the previous versions (1.15.x) ?

I made a small change to the build process that may have caused this, so if you could let me know what happens with an earlier version, that'd be handy thanks.

JoelGeorge693 commented 1 month ago

No, I am not using the latest version I am using 1.13.1. It was working till the 9th of this month started to have an issue since the 10th. If this helps.

CarlosNZ commented 1 month ago

That's odd, because /home/vsts/work/1/s/node_modules/json-edit-react/package.json' contains "type": "module". -- it only changed to use type: module in the very latest release.

You might be able to import the .cjs build directly, if that helps?

import {JsonEditor} from 'json-edit-react/build/index.cjs'

I don't know much about Azure pipelines, but I do suspect that the build process might be pulling in the latest version. Can you explicitly specify a max version in your package.json?

JoelGeorge693 commented 1 month ago

Yes, maybe you're right about the pulling of latest version I'll try adding a strict version and let you know. Also, if that doesn't work I'll try the direct import.

JoelGeorge693 commented 1 month ago

Thanks a lot, you're a life saver, restricting it to a strict version worked. Have a nice day.

CarlosNZ commented 1 month ago

Good to hear. I've just published a new version (1.16.1) with explicit exports specified in package.json, so maybe that will help?

I'm keen for this to work seamlessly in as many environments as possible, so I'll keep trying to make it as flexible as possible, so please post again if you have trouble with a specific version.

MattChowski commented 1 month ago

After updating to 1.16.1 I get Module not found: Error: Can't resolve 'react/jsx-runtime' for this package :/. If I revert to 1.13.1 all is good

MattChowski commented 1 month ago

If i try your workaround import {JsonEditor} from 'json-edit-react/build/index.cjs', it works but I lose all typescript types and I can't ts-ignore everything

CarlosNZ commented 1 month ago

After updating to 1.16.1 I get Module not found: Error: Can't resolve 'react/jsx-runtime' for this package :/. If I revert to 1.13.1 all is good

If you wouldn't mind, would you be able to go back through the versions from 1.16.1 to see where the problem came in? I'd like to pin it down exactly.

CarlosNZ commented 1 month ago

@MattChowski I've removed the type: module in 1.16.3. Can you confirm that version works for you?