Skip to content

Latest commit

 

History

History
158 lines (117 loc) · 7.15 KB

README.pt.md

File metadata and controls

158 lines (117 loc) · 7.15 KB

Aparentemente, o criador oficial não estava mais ativo na comunidade, então decidi fazer esta versão modificada. Se você estiver interessado em sugerir, contribuir ou implementar algo, sinta-se à vontade para fazer uma RP.(Créditos no final)

Se você já domina algum idioma e deseja ajudar na tradução do readme ou na correção das traduções já feitas, clique emestaemitir e / ou fazer um PR.

README Translation

Instalação

  1. Navegue até o diretório do seu aplicativo onde deseja incluir esta configuração de estilo.

    cd my-app

  2. Execute este comando dentro do diretório raiz do seu aplicativo. (Nota: este comando executa oautomatic-config.shscript bash sem a necessidade de clonar todo o repositório para sua 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. Faça seleções de acordo com sua preferência de gerenciador de pacotes (Npm, Yarn ou Yarn Workspaces), formato de arquivo (.js ou .json), tamanho máximo da linha e vírgulas finais (nenhum, es5, todos).

  4. Olhe no diretório raiz do seu projeto e observe os quatro arquivos de configuração recém-adicionados / atualizados:

    • .eslintrc.js(ou.eslintrc.json) (Instale oESLintextensão, pode ser facilmente adicionado pressionando (Ctrl + P) no VS Code, colando o seguinte comando (ext install ext install dbaeumer.vscode-eslint) e pressionando enter.)
    • .prettierrc.js(ou.prettierrc.json) (Instale oPrettier - Code formatterextensão, pode ser facilmente adicionado pressionando (Ctrl + P) no VS Code, colando o seguinte comando (ext install esbenp.prettier-vscode) e pressionando enter.)
    • .stylelintrc(Instale ostylelintextensão, pode ser facilmente adicionado pressionando (Ctrl + P) no VS Code, colando o seguinte comando (ext install stylelint.vscode-stylelint) e pressionando enter.)
    • .editorconfig(Instale oEditorConfig for VS Codeextensão, pode ser facilmente adicionado pressionando (Ctrl + P) no VS Code, colando o seguinte comando (ext install EditorConfig.EditorConfig) e pressionando enter.)

Pacotes

Pacotes Principais

  1. ESlint
  2. Mais bonita
  3. Stylelint

Configuração do Airbnb

  1. eslint-config-airbnb
    • Este pacote fornece .eslintrc do Airbnb como uma configuração compartilhada extensível.
  2. eslint-plugin-jsx-a11y(Dependência Par)
    • Verificador estático de AST para regras de acessibilidade em elementos JSX.
  3. eslint-plugin-react(Dependência Par)
    • Reaja as regras de linting específicas para ESLint
  4. eslint-plugin-import
    • Oferece suporte à sintaxe de importação / exportação ES2015 + (ES6 +) e evita problemas com erros ortográficos de caminhos de arquivo e nomes de importação.
  5. stylelint-config-airbnb
    • Este pacote fornece .stylelintrc do Airbnb como uma configuração compartilhada extensível.
  6. eslint-plugin-react-hooks
    • Este pacote fornece as Regras dos Ganchos.
  7. babel-eslint

ESlint, integração mais bonita

  1. eslint-plugin-mais bonito

    • Executa mais bonito como uma regra ESLint e relata diferenças como problemas ESLint individuais.

  2. estilete mais bonito

    • Executa o Prettier como uma regra do Stylelint e relata as diferenças como problemas individuais do Stylelint.

  3. eslint-config-mais bonito

    • Desativa todas as regras desnecessárias ou que possam entrar em conflito com o mais bonito.

  4. stylelint-config-mais bonita

    • Desativa todas as regras desnecessárias ou que possam entrar em conflito com o mais bonito.

Outras

  1. eslint-plugin-html
    • Um plugin ESLint para lint e consertar scripts embutidos contidos em arquivos HTML.
  2. eslint-plugin-is
    • Plug-in ESLint para Jest.

Arquivos de configuração criados

Uma vez que os arquivos são criados, você pode editá-los ao seu gosto.

eslintrc (.js / .json)

  • mais informações

    { "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 } ] } }

prettierrc (.js / .json)

  • mais informações

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

stylelintrc (.js / .json)

  • mais informações

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

.editorconfig

  • mais informações

    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 foi criado porPaulo Ramos, atualizado e modificado com novos recursos adicionados porArthur Nunes,Martin Dobrev,Visita,Justiça batizada. e inspirado por Jeffrey Zhen'stutorial.