- React Design Patterns and Best Practices(Second Edition)
- Carlos Santana Roldán
- 173字
- 2021-06-24 15:43:41
Airbnb React/JSX style guide
The Airbnb React/JSX style guide is the most popular style guide for coding in React.
To implement the Airbnb React/JSX style guide, we need to install some packages:
npm install --save-dev babel-eslint eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react
You can check all the ESLint rules on the official website (https://eslint.org/docs/rules) and all the special React ESLint rules at https://github.com/yannickcr/eslint-plugin-react/tree/master/docs/rules.
The rules that I prefer not to use, or that I prefer to change the default values of, are as follows:
- comma-dangle: Off
- arrow-parens: Off
- max-len: 120
- no-param-reassign: Off
- function-paren-newline: Off
- react/require-default-props: Off
First, you need to create a new file called .eslintrc at the root level:
{
"parser": "babel-eslint",
"extends": "airbnb",
"rules": {
"arrow-parens": "off",
"comma-dangle": "off",
"function-paren-newline": "off",
"max-len": [1, 120],
"no-param-reassign": "off",
"react/require-default-props": "off"
}
}
To run your linter, you have to add a lint script into your package.json file:
{
"scripts": {
"lint": "eslint --ext .jsx,.js src"
}
}
Now you can lint your files using the Airbnb React/JSX style guide.
推薦閱讀
- INSTANT PhpStorm Starter
- Proxmox High Availability
- 雷達饋線技術
- 智慧光網絡:關鍵技術、應用實踐和未來演進
- Unity Artificial Intelligence Programming
- 4G小基站系統原理、組網及應用
- 語音信號處理及Blackfin DSP實現
- 局域網組成實踐
- Microsoft Power Platform Enterprise Architecture
- 園區網絡架構與技術
- 新媒體交互藝術
- 現場綜合化網絡運營與維護:運營商數字化轉型技術與實踐
- Enterprise ApplicationDevelopment with Ext JSand Spring
- Hands-On Reactive Programming in Spring 5
- Building Microservices with Spring