How to disallow StyleSheet creation in ESLint?

Question

For certain folders I would like to enable StyleSheet.create() whereas for other folder I would like to disallow them.

Now I figured out how to override ESLint rules per folder, but how do I disallow StyleSheet.create() ?

Answer 1

A way that I used is to restrict the import of StyleSheet . It is even possible to provide a message with the ESLint warning.

"no-restricted-imports": ["warn", {
  "paths": [
    {
      "name": "react-native",
      "importNames": ["StyleSheet"],
      "message": "Please import StyleSheet only in *.styles.ts files within the components folder."
    }
  ],
}],

Then for the override:

overrides: [
  {
    files: [
      'app/components/**/*.styles.ts',
    ],
    rules: {
      "no-restricted-imports": ["error", {}]
    }
  }
],