Skip to content

Latest commit

 

History

History
158 lines (117 loc) · 7.18 KB

README.es.md

File metadata and controls

158 lines (117 loc) · 7.18 KB
Raw

Aparentemente, el creador oficial ya no estaba activo en la comunidad, así que decidí hacer esta versión modificada. Si está interesado en sugerir, contribuir o implementar algo, no dude en hacer un PR.(Créditos al final)

Si domina algún idioma y desea ayudar a traducir el archivo Léame o corregir las traducciones ya realizadas, haga clic enestoemitir y / o hacer un PR.

Traducción README

Instalación

  1. Navegue hasta el directorio de su aplicación donde desea incluir esta configuración de estilo.

    cd my-app

  2. Ejecute este comando dentro del directorio raíz de su aplicación. (Nota: este comando ejecuta elautomatic-config.shbash sin necesidad de clonar todo el repositorio en su máquina local.)

    exec 3<&1;bash <&3 <(curl https://raw.githubusercontent.com/otaldonunes/eslint-stylelint-prettier-airbnb-editorconfig-react/main/automatic-config.sh 2> /dev/null)

  3. Realice selecciones según sus preferencias de administrador de paquetes (Espacios de trabajo de Npm, Yarn o Yarn), formato de archivo (.js o .json), tamaño máximo de línea y comas finales (ninguno, es5, todos).

  4. Busque en el directorio raíz de su proyecto y observe los cuatro archivos de configuración recién agregados / actualizados:

    • .eslintrc.js(o.eslintrc.json) (Instala elESLintextensión, se puede agregar fácilmente presionando (Ctrl + P) en VS Code, pegando el siguiente comando (ext install ext install dbaeumer.vscode-eslint) y presionando enter.)
    • .prettierrc.js(o.prettierrc.json) (Instala elPrettier - Code formatterextensión, se puede agregar fácilmente presionando (Ctrl + P) en VS Code, pegando el siguiente comando (ext install esbenp.prettier-vscode) y presionando enter.)
    • .stylelintrc(Instala elstylelintextensión, se puede agregar fácilmente presionando (Ctrl + P) en VS Code, pegando el siguiente comando (ext install stylelint.vscode-stylelint) y presionando enter.)
    • .editorconfig(Instala elEditorConfig for VS Codeextensión, se puede agregar fácilmente presionando (Ctrl + P) en VS Code, pegando el siguiente comando (ext install EditorConfig.EditorConfig) y presionando enter.)

Paquetes

Paquetes principales

  1. ESlint
  2. Más bonita
  3. Stylelint

Configuración de Airbnb

  1. eslint-config-airbnb
    • Este paquete proporciona .eslintrc de Airbnb como una configuración compartida extensible.
  2. eslint-plugin-jsx-a11y(Dependencia de pares)
    • Verificador AST estático para reglas de accesibilidad en elementos JSX.
  3. eslint-plugin-react(Dependencia de pares)
    • Reaccionar reglas de pelusa específicas para ESLint
  4. eslint-plugin-import
    • Admite la sintaxis de importación / exportación de ES2015 + (ES6 +) y evita problemas con errores ortográficos en las rutas de archivo y los nombres de importación.
  5. stylelint-config-airbnb
    • Este paquete proporciona .stylelintrc de Airbnb como una configuración compartida extensible.
  6. eslint-plugin-react-hooks
    • Este paquete proporciona las Reglas de Hooks.
  7. babel-eslint

ESlint, integración más bonita

  1. eslint-plugin-más bonito

    • Se ejecuta Prettier como una regla de ESLint e informa las diferencias como problemas individuales de ESLint.

  2. estilizado-más bonito

    • Se ejecuta Prettier como una regla de Stylelint e informa las diferencias como problemas individuales de Stylelint.

  3. eslint-config-más bonito

    • Desactiva todas las reglas que son innecesarias o que pueden entrar en conflicto con Prettier.

  4. stylelint-config-más bonito

    • Desactiva todas las reglas que son innecesarias o que pueden entrar en conflicto con Prettier.

Otros

  1. eslint-plugin-html
    • Un complemento de ESLint para eliminar y corregir scripts en línea contenidos en archivos HTML.
  2. eslint-plugin-is
    • Complemento ESLint para Jest.

Archivos de configuración creados

Una vez creados los archivos, puede editarlos a su gusto.

eslintrc (.js / .json)

  • más información

    { "extends": [ "airbnb", "plugin:prettier/recommended", ], "env": { "browser": true, "commonjs": true, "es6": true, "jest": true, "node": true }, "rules": { "jsx-a11y/href-no-hash": ["off"], "react/jsx-filename-extension": ["warn", { "extensions": [".js", ".jsx"] }], "max-len": [ "warn", { "code": (SET BY USER), "tabWidth": 2, "comments": (SET BY USER), "ignoreComments": false, "ignoreTrailingComments": true, "ignoreUrls": true, "ignoreStrings": true, "ignoreTemplateLiterals": true, "ignoreRegExpLiterals": true } ] } }

más bonitorc (.js / .json)

  • más información

    { "printWidth": (SET BY USER), "singleQuote": true, "trailingComma": (SET BY USER) }

stylelintrc (.js / .json)

  • más información

    { "extends": ["stylelint-prettier/recommended", "stylelint-config-airbnb"] }

.editorconfig

  • más información

    root = true [*.{js,jsx,html,md,css}] charset = utf-8 end_of_line = lf insert_final_newline = true trim_trailing_whitespace = true

    [*.{js,jsx,css}] indent_size = 2 indent_style = space

Este script fue creado porPaulo Ramos, actualizado y modificado con nuevas funciones agregadas porArthur Nunes,Martín Dobrev,Visita,Justicia bautizada. e inspirado por Jeffrey Zhen'stutorial.