Visual Studio 尽管 linter 代码样式需要单引号,但代码格式代码带有双引号
Visual Studio Code formats code with double quotes although linter code style requires single quotes
我正在使用 NestJs 和 VueJs 进行开发,并使用通过 CLI 配置的代码风格。所以 Nest 将自己的代码风格与 TSLint 结合使用,而对于 VueJs,我想使用 AirBnb 代码风格。
基于我的current VSC extension settings
我使用具有以下设置的 ESLint、Vetur 和 Prettier
{
"editor.codeActionsOnSave": {
"source.fixAll": true
},
"editor.formatOnSave": true,
"vetur.format.defaultFormatter.js": "prettier-eslint",
"vetur.format.defaultFormatter.html": "prettier",
"vetur.format.defaultFormatter.ts": "prettier-tslint",
"prettier.singleQuote": true
}
不幸的是,VSC 将我的 Javascript 代码从单引号更新为双引号。我想根据配置的代码风格格式化我的代码,无论它是普通的 NodeJs、NestJs、Angular、React、Vue,...
有人介意告诉我如何正确设置编辑器吗?
不要将 eslint
与 prettier
一起使用,大多数情况下会发生冲突。这是非常适合我的设置,我使用 eslint-airbnb:
{
"window.zoomLevel": 2,
"workbench.colorTheme": "Solarized Dark",
"editor.tabSize": 2,
"editor.wordWrapColumn": 100,
"workbench.settings.editor": "json",
"workbench.settings.useSplitJSON": true,
"editor.formatOnSave": true,
"[javascript]": {
"editor.formatOnSave": false,
},
"eslint.autoFixOnSave": true,
"eslint.alwaysShowStatus": true,
"eslint.validate": [
{
"language": "vue",
"autoFix": true
},
{
"language": "html",
"autoFix": true
},
{
"language": "javascript",
"autoFix": true
}
],
"cSpell.userWords": [
"Dropdown",
"vuex"
],
"vetur.format.defaultFormatter.js": "vscode-typescript",
"vetur.grammar.customBlocks": {
"page-query": "graphql",
"static-query": "graphql"
},
"explorer.confirmDragAndDrop": false,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
}
在根文件夹中 ./.eslintrc.json
{
"extends": ["airbnb", "prettier"],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": ["error"]
}
}
如果您仍然喜欢使用 prettier,那么在根文件夹中创建文件 ./.prettierrc
{
"printWidth": 100,
"singleQuote": true,
"trailingComma": "all",
}
如果您还没有这样做,请安装这些 vs-code 扩展:
我正在使用 NestJs 和 VueJs 进行开发,并使用通过 CLI 配置的代码风格。所以 Nest 将自己的代码风格与 TSLint 结合使用,而对于 VueJs,我想使用 AirBnb 代码风格。
基于我的current VSC extension settings
我使用具有以下设置的 ESLint、Vetur 和 Prettier
{
"editor.codeActionsOnSave": {
"source.fixAll": true
},
"editor.formatOnSave": true,
"vetur.format.defaultFormatter.js": "prettier-eslint",
"vetur.format.defaultFormatter.html": "prettier",
"vetur.format.defaultFormatter.ts": "prettier-tslint",
"prettier.singleQuote": true
}
不幸的是,VSC 将我的 Javascript 代码从单引号更新为双引号。我想根据配置的代码风格格式化我的代码,无论它是普通的 NodeJs、NestJs、Angular、React、Vue,...
有人介意告诉我如何正确设置编辑器吗?
不要将 eslint
与 prettier
一起使用,大多数情况下会发生冲突。这是非常适合我的设置,我使用 eslint-airbnb:
{
"window.zoomLevel": 2,
"workbench.colorTheme": "Solarized Dark",
"editor.tabSize": 2,
"editor.wordWrapColumn": 100,
"workbench.settings.editor": "json",
"workbench.settings.useSplitJSON": true,
"editor.formatOnSave": true,
"[javascript]": {
"editor.formatOnSave": false,
},
"eslint.autoFixOnSave": true,
"eslint.alwaysShowStatus": true,
"eslint.validate": [
{
"language": "vue",
"autoFix": true
},
{
"language": "html",
"autoFix": true
},
{
"language": "javascript",
"autoFix": true
}
],
"cSpell.userWords": [
"Dropdown",
"vuex"
],
"vetur.format.defaultFormatter.js": "vscode-typescript",
"vetur.grammar.customBlocks": {
"page-query": "graphql",
"static-query": "graphql"
},
"explorer.confirmDragAndDrop": false,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
}
在根文件夹中 ./.eslintrc.json
{
"extends": ["airbnb", "prettier"],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": ["error"]
}
}
如果您仍然喜欢使用 prettier,那么在根文件夹中创建文件 ./.prettierrc
{
"printWidth": 100,
"singleQuote": true,
"trailingComma": "all",
}
如果您还没有这样做,请安装这些 vs-code 扩展: