![](/img/trans.png)
[英]Difference eslint between 'prettier/vue' and '@vue/prettier'
[英]Vue 2 - ESLint + Standard + Prettier
如何创建一个使用 ESLint + StandardJS + Prettier 的 Vue 2 项目?
StandardJS 的规则自然应该优先于 Prettier 的规则。
vue create 只提供以下选项:
我尝试了两件事:
我当然希望在项目配置级别而不是在 IDE 级别进行设置。
你能试试我刚刚创建的这个 repo 吗? 从我的测试来看,它看起来效果很好。
https://github.com/kissu/so-eslint-standard-prettier-config
standard
一个的配置转储到Prettier
一个中,更改可以在此提交中看到@vue/eslint-config-standard
抛出错误( Environment key "es2021" is unknown
)因为它需要 ESlint 7 才能工作,如本变更日志所示7.29.0
,修复了问题npx eslint --version
我试图从@vue/prettier
删除
extends: ['plugin:vue/essential', 'eslint:recommended', '@vue/standard', '@vue/prettier']
并查看它是否成功删除了任何内容;
确实如此!
错误确实来自 ESlint(如果我们确实删除了@vue/prettier
prettier ),并且它们仅在保存时由 ESlint 修复(在 ESlint 服务器 + VScode 重新启动后)!
把Prettier
放回去当然很好。
幸运的是,我有一台新 PC,因此有机会使用 VScode 尝试全新的配置。 我只需要安装ESlint并将这些设置放入我的settings.json
{
"editor.codeActionsOnSave": {
"source.organizeImports": false,
"source.fixAll": true,
"source.fixAll.eslint": true,
"source.fixAll.stylelint": true
}
}
格式化工作完美,不需要更多。
我有 eslint 7.8.1 和 Vue Prettier,我没有任何问题,也许你的 eslint 版本与 Prettier 不兼容,或者你的 eslint 有一些错误?
在每种方式中,我都会放置我的 eslint 配置,也许它会帮助你!
module.exports = {
env: {
'browser': true,
'es6': true,
'node': true
},
parserOptions: {
'parser': 'babel-eslint'
},
extends: [
'@vue/standard',
'plugin:vue/recommended'
],
rules: {
"vue/html-indent": ["error", 4, {
"attribute": 1,
"closeBracket": 0,
"switchCase": 0,
"ignores": []
}],
"vue/max-attributes-per-line": [2, {
"singleline": 10,
"multiline": {
"max": 1,
"allowFirstLine": false
}
}],
'indent': ['error', 4],
'vue/component-name-in-template-casing': ['error', 'kebab-case'],
'vue/script-indent': [
'error',
4,
{ 'baseIndent': 1 }
],
'space-before-function-paren': ['error', 'never'],
'semi': [2, "never"],
'vue/singleline-html-element-content-newline': 'off',
'vue/multiline-html-element-content-newline': 'off'
},
overrides: [
{
'files': ['*.vue'],
'rules': {
'indent': 'off'
}
}
]
}
也可能你忘记了 package.json 上的一些 devDependencies,那些是我的
"eslint": "^7.8.1",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-standard": "^4.0.1",
"eslint-plugin-vue": "^6.2.2"
希望那些会帮助你!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.