componentes
@ ele tem o comportamento pareceido com o Header de um site ele funciona sozinho independe de outros elementos
Entendendo o codigo
Syntax de JSX
Tag => View = Container Html
Reactotron instalando
-- yarn add reactotron-react-native --dev
import Reactotron from 'reactotron-react-native'
const tron = Reactotron .configure() .useReactNative() .connect();
console.tron = tron;
DevTools instalando
yarn add react-devtools --dev
ESLINT
yarn global add eslint
npm info "eslint-config-airbnb@latest" peerDependencies
{ eslint: '^4.9.0',
'eslint-plugin-import': '^2.7.0',
'eslint-plugin-jsx-a11y': '^6.0.2',
'eslint-plugin-react': '^7.4.0' }
yarn
yarn add babel-eslint eslint-config-airbnb eslint-plugin-react-native --dev
Conteudo do arquivo .eslintrc
{ "parser": "babel-eslint", "env": { "browser": true, "jest": true }, "plugins": [ "react-native", "jsx-a11y", "import" ], "extends": [ "airbnb", "plugin:react-native/all" ], "rules": { "react/jsx-filename-extension": [ "error", { "extensions": [ ".js", ".jsx" ] } ], "global-require": "off", "no-console": "off", "import/prefer-default-export": "off", "no-unused-vars": [ "error", { "argsIgnorePattern": "^_" } ] }, "globals": { "DEV": true } }
Babel Module Resolver
Define a raiz do projeto
yarn add babel-plugin-module-resolver eslint-import-resolver-babel-module --dev
incluir no .babelrc
"plugins": [ [ "module-resolver", { "cwd": "babelrc", "root": ["./src"], "extensions": [".js" , ".ios.js" , ".android.js"] } ] ]