在我们的JS文件中,我们有以下结构:
import { html } from 'lit-html';
function when(expression, trueValue, falseValue) {
if (expression) {
return trueValue();
}
if (falseValue) {
return falseValue();
}
return undefined;
}
export class SomeClass extends LitElement {
render = () => html`
<someHtml>
<p>Some text</p>
${when(
someCondition,
() => html`<div>on condition true</div>`
() => html`<div>on condition false</div>`
)}
</someHtml>
`;
}
when
函数会在Prettier和ESLint配置之间产生冲突。
下面是我们的prettier
配置:
{
"printWidth": 100,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5",
}
eslint/indent
规则:
"indent": [
"error",
2,
{
"SwitchCase": 1,
"CallExpression": { "arguments": 1 }
}
]
你能告诉我为什么我得到下面的错误?
1条答案
按热度按时间iezvtpos1#
不要使用eslint进行缩进。Prettier vs. Linters文档:
与ESLint/TSLint/stylelint等相比如何?
短绒有两类规则:
格式化规则:例如:max-len、no-mixed-spaces-and-tabs、keyword-spacing、comma-style...
Prettier减轻了对这整个规则类别的需求!Prettier将以一致的方式从头开始重新打印整个程序,因此程序员不可能再在那里犯错误:)
代码质量规则:例如no-unused-vars、no-extra-bind、no-implicit-globals、prefer-promise-reject-errors...
更漂亮的人对这些规则没有任何帮助。它们也是linters提供的最重要的,因为它们可能会捕获代码中的真正错误!
换句话说,使用Prettier来格式化,使用linter来捕获bug!
本指南也适用于eslint/indent规则。这种冲突(和解决方案)在其他地方有相当好的记录:
如果你还没有像Integrating with Linters中描述的那样在eslint和prettier之间做一个更纯粹的集成,然后确保你以后不会覆盖prettier/recommended,你很可能会从中受益。
作为一个侧面说明,请don't post screenshots of plaintext。相反,您可以使用以下内容表示错误:
示例代码:
显示的错误: