Jack-Works / react-refresh-transformer

React Refresh transformers for tooling authors
66 stars 6 forks source link

Support CommonJS target? #3

Open Jack-Works opened 3 years ago

Jack-Works commented 3 years ago

Now only the ESModule target is supported. It is not a severe problem because React code is handled by bundlers. If you also need to run the code by ts-node you can set up your tsconfig.json like this:

{
    "compilerOptions": {
        "module": "ESNext",
    },
    "ts-node": {
        "compilerOptions": {
            "module": "CommonJS"
        }
    }
}

But if you really need CommonJS support, please vote and address your use case here!

hectorhon commented 3 years ago

Supporting commonjs will allow importing 'react-hook-form', which fails with module not found when setting "module" to "EsNext" in tsconfig.json. As a workaround, I am currently using babel/preset-typescript to transpile ts instead of using ts-loader + react-refresh-typescript directly in webpack.config.js.

Jack-Works commented 3 years ago

Supporting commonjs will allow importing 'react-hook-form', which fails with module not found when setting "module" to "EsNext" in tsconfig.json. As a workaround, I am currently using babel/preset-typescript to transpile ts instead of using ts-loader + react-refresh-typescript directly in webpack.config.js.

Hi, I think you don't need to apply a react-refresh transformer on the dependencies because they're stable. Please try to exclude ts-loader to be applied on the node_modules and see if the problem solved.

hectorhon commented 3 years ago

I'm so sorry, I overlooked a setting in the tsconfig.json. After checking the tsconfig reference, I realize that after setting "module": "ESNext", I need to explicitly uncomment and set "moduleResolution": "node" in the tsc init generated tsconfig.json. In particular, the docs say:

If not specified, the default is Node for --module commonjs, and Classic otherwise (including when --module is set to amd, system, umd, es2015, esnext, etc.).

which explains why the module couldn't be found. Please forgive my ignorance, and thank you for maintaining such a useful plugin.