Maison > interface Web > js tutoriel > Quel est le style de code js ? Introduction au style de codage JavaScript

Quel est le style de code js ? Introduction au style de codage JavaScript

不言
Libérer: 2018-08-09 18:00:11
original
1557 Les gens l'ont consulté

Cet article vous explique quel est le style de code js ? L'introduction au style de codage JavaScript a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer, j'espère qu'elle vous sera utile.

1. Normes

Afin de s'entendre sur le style de codage de chacun, des spécifications de style de codage relativement standardisées sont nées dans la communauté :

  • JavaScript Style standard

  • Style JavaScript Airbnb

2 ESLint

ESLint fournit simplement des outils et des règles, comment. configurez-les. Les règles dépendent entièrement de l'utilisateur. Ceci est illustré en utilisant la configuration Airbnb.

2.1. Installer

$ npm info "eslint-config-airbnb@latest" peerDependencies
{ eslint: '^4.19.1',  'eslint-plugin-import': '^2.12.0',  'eslint-plugin-jsx-a11y': '^6.0.3',  'eslint-plugin-react': '^7.9.1' }


$ npx -v6.1.0$ npx install-peerdeps --dev eslint-config-airbnb+ eslint-config-airbnb@17.0.0+ eslint-plugin-jsx-a11y@6.1.1+ eslint-plugin-react@7.10.0+ eslint-plugin-import@2.13.0+ eslint@4.19.1SUCCESS eslint-config-airbnb and its peerDeps were installed successfully.
Copier après la connexion

2.2. Configurer

# 创建 package.json$ npm init -y

$ eslint --init? How would you like to configure ESLint?
  Answer questions about your style
❯ Use a popular style guide
  Inspect your JavaScript file(s)

? Which style guide do you want to follow?
  Google
❯ Airbnb
  Standard

? Do you use React? No
? What format do you want your config file to be in? JSON

+ eslint-plugin-import@2.13.0+ eslint-config-airbnb-base@13.0.0
Copier après la connexion

Générer enfin le fichier .eslint.json :

{
    "extends": "airbnb-base"}
Copier après la connexion

2.3 . Utilisez

2.3.1 dans la ligne de commande

$ ./node_modules/.bin/eslint -v
v4.19.1$ ./node_modules/.bin/eslint ./blog//Users/forwardNow/develop/work/study/blog/2018/08/test.js  35:1  warning  Unexpected console statement  no-console✖ 1 problem (0 errors, 1 warning)
Copier après la connexion

2.3.2 Configurez le script npm

"scripts": {
  "eslint": "./node_modules/.bin/eslint ./src/"},
Copier après la connexion

2.3.3. >

Recherchez et installez le plug-in eslint

Configurer les paramètres utilisateur :

"editor.detectIndentation": false,"editor.tabSize": 2,"eslint.autoFixOnSave": true,
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal