[开发工具]vscode代码相关自动格式化配置

vscode：setting.json

{
  "editor.renderIndentGuides": false,
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  },
  "git.confirmSync": false,
  "launch": {
    "configurations": [],
    "compounds": [],
    "search.exclude": {
      "system/": true,
      "!/system/**/*.ps*": true
    }
  },
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "[json]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },
  "terminal.integrated.automationShell.osx": "",
  "security.workspace.trust.untrustedFiles": "open",
  "sonarlint.ls.javaHome": "c:\\Users\\满船1167\\.vscode\\extensions\\sonarsource.sonarlint_managed-jre\\jre\\jdk-11.0.11+9-jre",
  "tabnine.experimentalAutoImports": true,
  "sonarlint.rules": {
    "javascript:S4326": {
      "level": "off"
    },
    "javascript:S125": {
      "level": "off"
    },
    "javascript:S4138": {
      "level": "off"
    },
    "javascript:S3776": {
      "level": "off"
    },
    "javascript:S3626": {
      "level": "off"
    },
    "javascript:S2310": {
      "level": "off"
    },
    "javascript:S3358": {
      "level": "off"
    }
  },
  "workbench.iconTheme": "material-icon-theme",
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  // 默认使用prettier格式化支持的文件
  "vetur.format.defaultFormatter.js": "prettier",
  "vetur.format.defaultFormatter.html": "prettyhtml",
  "vetur.format.defaultFormatterOptions": {
    "prettier": {
      // 结尾无分号
      "semi": false,
      // 超过140个字符换行
      "printWidth": 140,
      // 使用单引号
      "singleQuote": true,
      // 无尾随逗号
      "trailingComma": "none",
      // 箭头函数单个参数不加分号
      "arrowParens": "avoid"
    },
    "prettyhtml": {
      "printWidth": 140
    }
  },
  "editor.formatOnSave": true,
  "editor.tabSize": 4,
  // false去掉代码结尾的分号
  "prettier.semi": false,
  // 使用带引号替代双引号
  "prettier.singleQuote": true,
  // 去除最后一个对象结尾的逗号
  "prettier.trailingComma": "none",
  // 超过140字符进行换行
  "prettier.printWidth": 140,
  // (x) => {} 是否要有小括号默认avoid不要，always要
  "prettier.arrowParens": "avoid",
}

项目根目录下新建文件.prettierrc.js

module.exports = {
	// 超过最大值换行
	printWidth: 140,
	// 行末是否加分号
	semi: false,
	// 用单引号代替双引号
	singleQuote: true,
	// tab键宽度，默认为4
	tabWidth: 4,
	// 最后一个对象元素加逗号
	trailingComma: 'none',
	// 开启 eslint 支持
	'prettier.eslintIntegration': true,
	// 指定使用哪一种解析器
	parser: 'babel',
	// 对象，数组加空格
	bracketSpacing: true,
	// 使用tab（制表符）缩进而非空格
	useTabs: true,
	// jsx > 是否另起一行
	jsxBracketSameLine: false,
	// (x) => {} 是否要有小括号默认avoid不要，always要
	arrowParens: 'avoid',
	// 是否要注释来决定是否格式化代码
	requirePragma: false,
	// 是否要换行
	proseWrap: 'preserve',
	// 保存时自动fix
	'eslint.autoFixOnSave': true,
	// 添加 vue 支持
	'eslint.validate': [
		'javascript',
		'javascriptreact',
		{
			language: 'vue',
			autoFix: true
		}
	]
}

根目录下新建文件.editorconfig

# http://editorconfig.org
# editorconfig顶级配置文件,停止向上寻找配置文件
root = true

[*]
# 缩进风格tab或者space
indent_style = tab
# 缩进大小2或者4
indent_size = 4
# 换行符
end_of_line = lf
# 字符集
charset = utf-8
# 是否删除行尾的空格
trim_trailing_whitespace = true
# 是否在文件的最后插入一个空行
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false

[Makefile]
indent_style = tab

根目录下新建文件.eslintrc.js

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true,
    es6: true
  },
  // extends: ['plugin:vue/essential', '@vue/standard'],
  extends: ['plugin:vue/recommended', 'eslint:recommended'],
  parserOptions: {
    parser: 'babel-eslint',
    sourceType: 'module'
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    indent: ['off', 2],
    'no-irregular-whitespace': 'off',
    'vue/script-indent': ['error', 4, { baseIndent: 1 }],
    'space-before-function-paren': [0, 'always'],
    // 强制在注释中 // 或 /* 使用一致的空格
    'spaced-comment': 0,
    // always-multiline：多行模式必须带逗号，单行模式不能带逗号
    'comma-dangle': [1, 'never'],
    // 末尾禁止使用分号
    'no-mixed-spaces-and-tabs': [1, 'smart-tabs'],
    // semi: 0,
    'no-tabs': 0,
    'linebreak-style': ['off', 'windows'],
    quotes: ['error', 'single'],
    semi: ['error', 'never']
  }
}

vscode安装插件:

EditorConfig for VS Code
Prettier