Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix import react error in some cases #16

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

pgarr
Copy link

@pgarr pgarr commented Apr 11, 2023

Fixes #12.
Based on below resources, I changed "jsx": "react-jsx" in tsconfig.json. It allows proper jsx compilation without import React from 'react'.
https://stackoverflow.com/questions/64656055/react-refers-to-a-umd-global-but-the-current-file-is-a-module/65539274#65539274
https://devblogs.microsoft.com/typescript/announcing-typescript-4-1/#jsx-factories

@RexSkz
Copy link
Owner

RexSkz commented Apr 11, 2023

I think it's okay to change the createElement to _jsx, but here are two things we should consider:

  1. We should modify the version of react and react-dom in peerDependencies. According to the article in React blog, the minimum version below 17 and support _jsx call is 16.14.0, but currently it's ^16.0.0 in this repo.
  2. It's better to have a file tsconfig.dev.json with "jsx": "react-jsxdev" option. This library uses ESBuild to compile, maybe you should change rollup.config.js and esbuild.mjs instead of tsconfig.json.

@RexSkz
Copy link
Owner

RexSkz commented Apr 11, 2023

Also, I'm curious why this will fix the "Cannot use import statement outside a module" issue. The compiled files are still in ESM, if your project doesn't use ESM and there's no transpiler (e.g. Webpack), you'll still get this error.

Maybe json-diff-kit should provide CJS dist as well since ESM is not widely used as I expected...

@jpage-godaddy
Copy link

I'd definitely love it if this had a CommonJS distribution; I'm currently struggling to get this to import using babel in a CommonJS-based project.

@RexSkz
Copy link
Owner

RexSkz commented Jul 7, 2023

I'd definitely love it if this had a CommonJS distribution; I'm currently struggling to get this to import using babel in a CommonJS-based project.

CJS is on the way, but there're some issues to solve. A new version with CJS support will be released once I finish my company work (in a day or two I think).

@jpage-godaddy
Copy link

For what it's worth, I forked your main branch and published what you have to a private package repository, and the CommonJS export is working great. Looking forward to when it's published.

Copy link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

SyntaxError: Cannot use import statement outside a module
3 participants