Dar os seguintes comandos:
- To check syntax, find problems, and enforce code style JavaScript modules (import/export)
- React
- Browser
- Use a popular style guide
- Airbnb
- JavaScript
- Selecione Yes
- Selecione Yes
$yarn add [email protected] --exact -D
Apagar os seguintes arquivos:
- README.md
- manifest.json (dentro da pasta public)
- Dentro da pagina SRC, apagar todos os arquivos exceto os arquivos App.js e index.js
- package-lock.json
- yarn-error.log
Substituir o conteudo do arquivo package.json por:
{
"name": "modulo07",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"babel-eslint": "^10.0.2",
"eslint": "^5.16.0",
"eslint-config-airbnb": "^17.1.1",
"eslint-config-prettier": "^6.0.0",
"eslint-plugin-import": "^2.18.0",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.0",
"eslint-plugin-react": "^7.14.2",
"prettier": "^1.18.2"
}
}
Substituir os dados do arquivo index.html (pasta public) por:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Rocketshoes</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
Substituir os dados do arquivo index.js (pasta src) por:
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(<App />, document.getElementById('root'));
Substituir os dados do arquivo App.js (pasta src) por:
function App() {
return (
<div className="App">
<h1>Hello Redux</h1>
</div>
);
}
export default App;
Embaixo do arquivo yarn.lock, clicar com o botão direito do mouse e selecionar Generate.editorconfig.
Substituir os dados do arquivo .eslintrc.js por:
module.exports = {
env: {
browser: true,
es6: true,
},
extends: ['airbnb', 'prettier', 'prettier/react'],
globals: {
Atomics: 'readonly',
SharedArrayBuffer: 'readonly',
},
parser: 'babel-eslint',
parserOptions: {
ecmaFeatures: {
jsx: true,
},
ecmaVersion: 2018,
sourceType: 'module',
},
plugins: ['react', 'prettier'],
rules: {
'prettier/prettier': 'error',
'react/jsx-filename-extension': [
'warn',
{ extensions: ['.jsx', 'js'] },
],
'import/prefer-default-export': 'off',
},
};
Criar na raiz um arquivo .prettierrc com o seguinte conteudo:
{
"singleQuote": true,
"trailingComma": "es5"
}