使用eslint和更漂亮的设置生成HTML文件

时间:2019-09-05 22:44:25

标签: html eslint prettier

我在通过更漂亮的结尾格式化html文件时遇到问题。通过在单个标签中添加/>来通过html代码进行更漂亮的格式化,但是我不想在标签的末尾使用斜杠字符。第二个问题是在“ html”标记中为“ head”和“ body”标记添加缩进,我希望仅在“ body”和“ head”标记中使用缩进。

第二个问题是与我的JS代码中的漂亮和雅致冲突。 ESlint返回问题,因为我为4个空格设置了缩进,但是更漂亮的是只想使用两个空格。

像这样的漂亮返回代码

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Document</title>
    </head>
    <body></body>
</html>

但是我想要这样的东西

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

</body>
</html>

我的pacpage.json更漂亮和更有趣

    "eslint": "^6.1.0",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-config-prettier": "^6.2.0",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-prettier": "^3.1.0",
    "eslint-plugin-react": "^7.14.3",
    "eslint-plugin-react-hooks": "^1.7.0",
    "prettier": "^1.18.2",

.eslintrc.json

{
    "extends": ["airbnb", "prettier"],
    "plugins": ["prettier"],
    "rules": {
        "prettier/prettier": ["error"],
        "indent": [
            "error",
            4,
            { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }
        ]
    }
}

.prettierrc

{
    "singleQuote": true,
}

感谢您的帮助。

0 个答案:

没有答案