Home  >  Article  >  Development Tools  >  A brief discussion on the configuration and use of eslint in atom

A brief discussion on the configuration and use of eslint in atom

青灯夜游
青灯夜游forward
2021-06-17 11:05:493579browse

This article will introduce to you how to use eslint & atom together. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.

A brief discussion on the configuration and use of eslint in atom

[Related recommendation: "atom tutorial"]

Download aotm plug-in linter-eslint

https://github.com/AtomLinter/linter-eslint

Requires settings as follows:

  • Install locally to your project eslint and the plugin
    • $ npm i --save-dev eslint [eslint-plugins]
  • Install globally eslint and plugins
    • $ npm i -g eslint [eslint-plugins]
    • Activate Use Global Eslint package option
    • (Optional) Set Global Node Path with $ npm config get prefix

provides some plug-ins, which can be downloaded by yourself (ps: version differences will cause some Plug-in error)

  • eslint-config-airbnb
  • eslint-plugin-import
  • eslint-plugin-jsx-a11y
  • eslint-plugin -react
  • eslint-plugin-html (can parse scripts in html, the latest version v4 conflicts with early eslint)

Then under the project
$ eslint --init


Use the following comments to turn off the prompt.

/* eslint-disable */

Use eslintignore to ignore specific files and directories

Create a .eslintignore file, add the folders that need to be filtered, or file

 build/*
 app/lib/*

command Line use --ignore-path:

$ eslint --ignore-path .eslintignore --fix app/*

The path is relative At the location of .eslintignore or the current working directory

See more at http://eslint.cn/docs/user-guide/configuring

Basic configuration:

module.exports = {
    parser: 'babel-eslint',

    "env": {
        "browser": true,
        "commonjs": true,
        "es6": true
    },

    // 以当前目录为根目录,不再向上查找 .eslintrc.js
    root: true,

    // 禁止使用 空格 和 tab 混合缩进
    "extends": "eslint:recommended",

    globals: {
        // 这里填入你的项目需要的全局变量
        // jQuery: false,
        $: false,
        wx: false,
    },
    
    // eslint-plugin-html 开启
    "plugins": [
        "html"
    ],

    "parserOptions": {
        "ecmaFeatures": {
            "jsx": false
        },
        "sourceType": "module"
    },

    "rules": {
        "indent": ["error", 'tab'],

        "linebreak-style": ["error","unix"],

        "quotes": ["error","single"],

        "semi": ["error","always"],

        "semi": ["error","always"],

        "arrow-spacing": ["error", { "before": true, "after": true }],

        "no-unused-vars": "off", //禁止提示没有使用的变量,或者函数

        "block-spacing": "error",

        "no-console": "off", //可以使用console

        "keyword-spacing": ["error", { "before": true }] //强制关键字周围空格的一致性

    }
};

For more programming-related knowledge, please visit: Programming Teaching! !

The above is the detailed content of A brief discussion on the configuration and use of eslint in atom. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:juejin.cn. If there is any infringement, please contact admin@php.cn delete