项目总结-ESLint配置|青训营笔记

这是我参与「第四届青训营 」笔记创作活动的第24天

什么是EsLint?

ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项目。它的目标是提供一个插件化的javascript代码检测工具。以便团队协作时保持代码风格的一致。

这就留下了一个问题，多留一个空格，一个回车，都会导致出错！

问题解决

用到的是两个插件，均在VScode中安装，分别是ESLint和Prettier - Code formatter,安装完成后，打开设置。

然后，点击这里打开setting.json文件

在其中添加如下信息即可。

        //ESLint配置
    "editor.codeActionsOnSave": {
        "source.fixAll": true
    },
    "eslint.alwaysShowStatus": true,
    "prettier.semi": false,
    "prettier.printWidth": 300,
    //双引号替换为单引号
    "prettier.singleQuote": true,
    "prettier.arrowParens": "avoid",
    "vetur.format.defaultFormatter.html": "js-beautify-html", 
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_attributes": "force-expand-multiline"
        },
        "prettyhtml": {
            "printWidth": 100,
            "singleQuote": false,
            "wrapAttributes": false,
            "sortAttributes": false
        },
        "prettier": {
            "trailingComma": "none",
            "semi":false,
            "singleQuote":true,
            "arrowParens":"avoid",
            "printWidth":300
        }
    },

配置好后，按Ctrl+S即可进行格式化！！！