我在我的Vue项目中使用eslint-plugin-vue .
我有以下 .prettierrc
文件:
// /.prettierrc
{
"arrowParens": "avoid",
"bracketSpacing": true,
"insertPragma": false,
"jsxBracketSameLine": false,
"printWidth": 80,
"proseWrap": "preserve",
"requirePragma": false,
"semi": false,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5",
"useTabs": false
}
以下 .eslintrc.js
文件:
module.exports = {
root: true,
env: {
node: true,
},
extends: [
'plugin:vue/recommended',
'@vue/prettier',
],
rules: {
'linebreak-style': ['error', 'unix'],
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
'vue/max-attributes-per-line': 'off',
'vue/html-self-closing': [
'error',
{
html: {
void: 'always',
normal: 'always',
component: 'always',
},
svg: 'always',
math: 'always',
},
],
},
plugins: ['vue'],
parserOptions: {
parser: 'babel-eslint',
},
}
但不幸的是,更漂亮的人认为
<template>
<header><a href="/" class="logo"> Home </a></header>
</template>
比较漂亮
<template>
<header>
<a href="/" class="logo">
Home
</a>
</header>
</template>
如何在Vue模板中保留更漂亮的垂直空白?
有没有类似于我想要的规则?