Home > Development Tools > atom > body text

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

青灯夜游
Release: 2022-02-15 19:36:30
forward
3596 people have browsed it

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 */
Copy after login

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/*
Copy after login

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 }] //强制关键字周围空格的一致性

    }
};
Copy after login

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!

Related labels:
source:juejin.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template