React Native Lint/Format/TS Baseline

Shared config package for React Native projects (react-native >= 0.80.0) with:

• ESLint config
• Prettier config
• TypeScript config

Install In Consumer Project

npm install -D @magikbee/eslint-config-magikbee-react-native

Install peer dependencies:

npm install -D @react-native/eslint-config @react-native/typescript-config @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-config-standard eslint-config-prettier eslint-plugin-import eslint-plugin-n eslint-plugin-promise eslint-plugin-react eslint-plugin-react-native eslint-plugin-reactotron prettier typescript

Use ESLint Config

Create/update .eslintrc:

{
  "extends": ["@magikbee/eslint-config-magikbee-react-native"]
}

This shared config includes @react-native as the React Native baseline required by recent RN versions.

Use Prettier Config

Create/update prettier.config.cjs:

module.exports = require("@magikbee/eslint-config-magikbee-react-native/prettier")

Use TypeScript Config

Create/update tsconfig.json:

{
  "extends": "@magikbee/eslint-config-magikbee-react-native/tsconfig"
}

Override Rules

Add custom ESLint rules in the consumer .eslintrc:

{
  "extends": ["@magikbee/eslint-config-magikbee-react-native"],
  "rules": {
    "no-console": "off"
  }
}

Integration With VSCode

Install the ESLint extension and set:

{
  "eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
  "editor.formatOnSave": false,
  "eslint.alwaysShowStatus": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}

Create A New NPM Version

1. Update package version:

npm version <new-version>

2. Commit the version files:

git add package.json package-lock.json
git commit -m "chore(release): <new-version>"

3. Create and push the git tag:

git tag <new-version>
git push origin main --tags

4. Publish to npm:

npm publish --access public