创建新项目时使用Vue CLI v4.0.5检查选项打字稿 and 短绒/格式化程序，您将获得用于 linting 和格式化的预配置选项：
? Pick a linter / formatter config: (Use arrow keys)
> ESLint with error prevention only
ESLint + Airbnb config
ESLint + Standard config
ESLint + Prettier
TSLint (deprecated)
我想用爱彼迎规则 for ESLint with Prettier（保存时格式化），带有TypeScript 解析器 and Vue CLI v4.
这些配置也应该可以很好地配合使用VS Code 的 Vetur 扩展.
如何配置这个工具组合？
请注意，这不是一个愚蠢的问题。有类似的问题，但与 Vue CLI4、TypeScript、ESLint、Airbnb、Prettier 以及与 Vetur / VS Code 一起使用的这些确切要求无关。
编辑 2020/02- 这个挑战的性质最近发生了很大变化，所以我提出并自我回答了另一个问题：如何在 VS Code 编辑器中使用 ESLint + Airbnb 规则 + TypeScript + Stylelint for SCSS 配置 Vue CLI 4，并在保存时自动修复？
根据一篇博客文章，我发现 [1] 这些步骤应该确保它有效：
-
下载 VSCode 的 ESLint 和 Prettier 扩展。
-
将 ESLint 和 Prettier 库安装到我们的项目中。在项目的根目录中，您需要运行：
npm install -D eslint prettier
- 安装 Airbnb 配置。如果您使用 npm 5+，您可以运行此快捷方式来安装配置及其所有依赖项：
npx install-peerdeps --dev eslint-config-airbnb
- 安装 eslint-config-prettier （禁用 ESLint 格式）和 eslint-plugin-prettier （允许 ESLint 在我们键入时显示格式错误）
npm install -D eslint-config-prettier eslint-plugin-prettier
- Create
.eslintrc.json文件位于项目的根目录中：
{
"extends": ["airbnb", "prettier"],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": ["error"]
},
}
- Create
.prettierrc file在项目的根目录中。您可以在此处配置格式设置。我在下面添加了一些我自己的首选项，但我强烈建议您阅读有关 Prettier 配置文件的更多信息
{
"printWidth": 100,
"singleQuote": true
}
- 最后一步是确保保存时格式更漂亮。插入
"editor.formatOnSave": true进入 VSCode 中的用户设置。
[1] https://blog.echobind.com/integrating-prettier-eslint-airbnb-style-guide-in-vscode-47f07b5d7d6a
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
