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

Can you give an example of using this with "craco"? #27

Open
PjotrB opened this issue Dec 4, 2023 · 0 comments
Open

Can you give an example of using this with "craco"? #27

PjotrB opened this issue Dec 4, 2023 · 0 comments

Comments

@PjotrB
Copy link

PjotrB commented Dec 4, 2023

Your Readme shows how to make toDates work using a modified webpack.config.js.
That would require that I run "eject" on my React project, which is not recommended by just about everyone everywhere, and I'd rather not do it...

As an alternative I am using craco for overriding the configuration of the project.

I tried adding the code from your webpack.config.js to my craco.config.js in a few ways, but it had no effect at all.
I always get this error, both with and without the added config code:

ERROR in ./src/pages/Page.tsx 31:4-11

export 'toDates' (imported as 'toDates') was not found in 'ts-transformer-dates' (possible exports: __esModule, applyToDates, toDatesByArray)"

Below is what my craco.config.js attempts look like. Both attempts do nothing, the above error appears with or without it.

If you could provide code for craco.config.js that makes this work, I would be very grateful!

Attempt # 1:

const datesTransformer = require('ts-transformer-dates/lib/transformer').default;

module.exports = {
  module: {
    rules: [
      {
        test: /\.ts$/,
        loader: 'ts-loader', // or 'awesome-typescript-loader'
        options: {
          // make sure not to set `transpileOnly: true` here, otherwise it will not work
          getCustomTransformers: program => ({
            before: [datesTransformer(program)]
          })
        }
      }
    ]
  }
}

Attempt # 2, this uses a webpack property that I saw being used somewhere, but that also has no effect at all:

const datesTransformer = require('ts-transformer-dates/lib/transformer').default;

module.exports = {
  webpack: {   // <--- extra property level
    module: {
      rules: [
        {
          test: /\.ts$/,
          loader: 'ts-loader', // or 'awesome-typescript-loader'
          options: {
            // make sure not to set `transpileOnly: true` here, otherwise it will not work
            getCustomTransformers: program => ({
              before: [datesTransformer(program)]
            })
          }
        }
      ]
    }
  }
}
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

No branches or pull requests

1 participant