Created
July 21, 2021 10:56
-
-
Save PhilippMolitor/00f427d12a9c5bca84309058d88846b7 to your computer and use it in GitHub Desktop.
Fix including yarn workspaces packages in create-react-app with craco
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
module.exports = { | |
webpack: { | |
configure: (webpackConfig) => ({ | |
...webpackConfig, | |
module: { | |
...webpackConfig.module, | |
rules: webpackConfig.module.rules.map((rule) => { | |
if (!rule.oneOf) return rule; | |
return { | |
...rule, | |
oneOf: rule.oneOf.map((ruleObject) => { | |
if ( | |
!new RegExp(ruleObject.test).test('.ts') || | |
!ruleObject.include | |
) | |
return ruleObject; | |
return { ...ruleObject, include: undefined }; | |
}), | |
}; | |
}), | |
}, | |
}), | |
}, | |
}; |
Thank you. This really help me.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hey @JulianDM95-TP ,
it was done by simply reverse-engineering the structure of one of the existing but more "hacky" patches, which simply used
delete ...
to remove a static index from the rules array.Let's see:
This block takes the entire webpack config, and just repeats everything but the
module
property, which we will work on.Rules that do not contain the
oneOf
property will be skipped and returned as-is from the.map()
function. Those who contain the propery will be cloned and we apply custom settings.We match against every element of the
oneOf
array, and see if we use thetest
property as a compiled regex, we execute a test to assert it matching.ts
files, and having theinclude
property.If one of those conditions isn't met, we just return it as-is, if not, we found the rule object we were looking for, and return it with all its properties, except
include
, which we simple unset.All of this is just done to preserve any existing rules and settings without any modification. This code just searches for this very specific pattern of a rule and just modifies that.
Hope this explanation helps 💯