Quel est le style de code js ? Introduction au style de codage JavaScript-js tutoriel-php.cn

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

不言

Libérer： 2018-08-09 18:00:11

original

1567 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: &#39;^4.19.1&#39;,  &#39;eslint-plugin-import&#39;: &#39;^2.12.0&#39;,  &#39;eslint-plugin-jsx-a11y&#39;: &#39;^6.0.3&#39;,  &#39;eslint-plugin-react&#39;: &#39;^7.9.1&#39; }


$ 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!