added eslint dependencies for typescript

[rodineijf]

React native is initialised by default with eslint rules, but we need some parsers to make this work with typescript.

Test Plan

Run yarn lint on console

What's required for testing (prerequisites)?

What are the steps to reproduce (after prerequisites)?

Compatibility

OS	Implemented
iOS	✅❌
Android	✅❌

Checklist

• I have tested this on a device and a simulator
• I added the documentation in README.md
• I mentioned this change in CHANGELOG.md
• I updated the typed files (TS and Flow)
• I added a sample use of the API in the example project (example/App.js)

[dantasfiles]

When I create a react native typescript project with
npx react-native init AwesomeTSProject --template react-native-template-typescript
and then open the resulting project with VSCode,
typescript errors like Argument of type 'string' is not assignable to parameter of type 'number' are shown.
But eslint errors like 'x' is defined but never used are not shown,
until I manually install eslint with
npm install -D eslint

So this pull request (or just the part of it that adds eslint@6.7.2 to the dev dependencies) would make it so I don't have to manually add eslint each time I create a project.

[emin93]

As far as I can tell, the default JS template only comes with @react-native-community/eslint-config and a pre-defined .eslintrc that extends from it. eslint as a package isn't included, so in theory this shouldn't be an issue at all, except for those who wish to use ESLint (which has to be installed separately anyway).

I think this issue is related to the ESLint Plugin in VS Code which has a built-in linter and tries to automatically lint with that one. When I do the same without the ESLint Plugin installed, I don't get any issues.

I'd like to prevent adding any additional dependencies which don't come with the default JS template and are only necessary for this scenario.

[emin93]

I am closing this PR for now. I would suggest to open a PR in the React Native JS template repo to add eslint as a dev dependency. If it gets added there, we can add it here as well.

[dantasfiles]

@emin93

The default react-native template does include eslint

When you run npx react-native init RNTest
a package.json file is created with the following devDependencies:

  "devDependencies": {
    "@babel/core": "^7.6.2",
    "@babel/runtime": "^7.6.2",
    "@react-native-community/eslint-config": "^0.0.5",
    "babel-jest": "^24.9.0",
    "eslint": "^6.5.1",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.56.0",
    "react-test-renderer": "16.9.0"
  },

Compare that to the devDependencies of this typescript template

  "devDependencies": {
    "@babel/core": "^7.6.2",
    "@babel/runtime": "^7.6.2",
    "@react-native-community/eslint-config": "^0.0.5",
    "@types/jest": "^24.0.18",
    "@types/react-native": "^0.60.22",
    "@types/react-test-renderer": "16.9.0",
    "babel-jest": "^24.9.0",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.56.0",
    "react-test-renderer": "16.9.0",
    "typescript": "^3.7.3"
  },

The only non-typescript difference is that the default template has eslint and this template does not.

The VSCode eslint plugin "uses the ESLint library installed in the opened workspace folder," so when I open a default react-native project in vscode, it finds eslint errors, but when I open a typescript react-native project in vscode, it does not, until I manually run npm install -D eslint

[rodineijf]

As far as I can tell, the default JS template only comes with @react-native-community/eslint-config and a pre-defined .eslintrc that extends from it. eslint as a package isn't included, so in theory this shouldn't be an issue at all, except for those who wish to use ESLint (which has to be installed separately anyway).

I think this issue is related to the ESLint Plugin in VS Code which has a built-in linter and tries to automatically lint with that one. When I do the same without the ESLint Plugin installed, I don't get any issues.

I'd like to prevent adding any additional dependencies which don't come with the default JS template and are only necessary for this scenario.

I started a new app and confirmed that ESLint is included by default.

You can check here

[emin93]

Welp, seems like you are absolutely right, don't know how I missed that yesterday.

/edit
Ah now I see how I missed it 😅
It's not included in the master branch: https://github.com/facebook/react-native/blob/master/template/package.json

I don't know why it's not added there, maybe it will get removed again with the next RN version? Anyway, I released a new version of the template with added eslint and some lint related fixes.