timarney / react-app-rewired

Override create-react-app webpack configs without ejecting

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Problems overriding jest.transformIgnorePatterns

Luismahou opened this issue · comments

Hi there!

First of all, thanks for this awesome project!

We use packages that are written in ES6. Jest by default doesn't transform anything inside node_modules unless transformIgnorePatterns is set. If jest is used without create-react-app the following configuration fixes the issue:

"jest": {
  "transformIgnorePatterns": ["/node_modules/(?!(@my-company)/).*/"]
}

NOTE: @my-company is used because all the packages are scoped.

When we use that configuration with create-react-app and react-app-rewired the final value for that option is:

["/node_modules/(?!(@my-company)/).*/", "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs)$"]

Jest would run both regular expressions and if any of them is matched the file won't be transformed. The second regex matches all .js inside node_modules forcing jest to do not transform the files inside node_modules/@my-company.


I can think of a couple of solutions:

  1. Override transformIgnorePatters instead of append. My impression is that if anyone needs to modify this option, they will always want to avoid the default pattern.
  2. Use a special property to enable overriding. For example:
"jest": {
  "override": {
    "transformIgnorePatterns": ["..."]
  }
}

Please, let me know your thoughts. If you're happy with any of the solutions I'll submit a PR.

Thanks

@dawnmist if you have any time this and #240 jest issues have come up.

@timarney Both this and #240 have the same root cause - although #240 is also affected by not passing even the permitted overrides into create-react-app.

React-app-rewired merges any array or object values defined in package.json with the original values from create-react-app (react-scripts package) instead of overwriting them. I don't know the history of why it was done this way. I think this either needs to be documented in the Readme or the decision to be re-looked at, as it wasn't behaviour I'd expected initially either.

What you can do to make an overwrite setting instead of a setting to be merged is to apply the setting inside the jest function in config-overrides, which is run after the merge has occurred. This lets you make a full replacement instead of a merge replacement.

module.exports = {
  jest: (config) => {
    config.transformIgnorePatterns = ["/node_modules/(?!(@my-company)/).*/"]
    return config;
  }
}

@dawnmist Thanks, that works like a charm!

@timarney Did this get closed because there is a workaround? Or is this intended behavior? At the very least, they should be some documentation around it. (See #294)

I'd agree with @Gidgidonihah. I'd say, user's rules should be appended, instead of prepended as it is now, to make possible such override.
As it currently works is a bug.