プロジェクトエラー除外プロセス-eslint&prettyerをvue 3に適用

まるで一人でコードしたようです。

プロジェクトを行う上で、チームメンバーも私も同意します.
このため,文法と符号化会議を行い,eslintとpretterを用いることにした.

Eslintは、通常、入力エラーの構文を自動的に変更するために使用されます。

Prettierは、チームメンバー間のエンコード会議を調整するために使用されます。

エラー

Eslintとprettyerが衝突した.
eslintrc.jsファイルでは、prettyerプラグインを次のように設定できます.
rulesにルールを設定しました.

module.exports = {
	// 현재 eslintrc 파일을 기준으로 ESLint 규칙을 적용
	root: true,
	// 추가적인 규칙들을 적용
	env: {
		node: true,
	},
	extends: [
		'eslint:recommended',
		'plugin:vue/essential',
		'prettier',
		'plugin:prettier/recommended',
	],
	// 코드 정리 플러그인 추가
	plugins: ['prettier'],
	// 사용자 편의 규칙 추가
	rules: {
		'prettier/prettier': [
			'error',
			// 아래 규칙들은 개인 선호에 따라 prettier 문법 적용
			// https://prettier.io/docs/en/options.html
			{
				singleQuote: true,
				semi: false,
				useTabs: true,
				tabWidth: 2,
				trailingComma: 'all',
				printWidth: 80,
				bracketSpacing: true,
				arrowParens: 'avoid',
				endOfLine: 'auto',
			},
		],
		semi: ['error', 'never'],
		quotes: ['error', 'single'],

		'vue/html-self-closing': [
			'error',
			{
				html: {
					void: 'always',
					normal: 'never',
					component: 'always',
				},
				svg: 'always',
				math: 'always',
			},
		],
		'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
	},
}

あんなにうまく適用されると思ったけど...

Eslintとprettyerが衝突した。

きれいなルール

Eslintルール

保存するたびにお互いに非難し合う状況になってしまいましたが・・・

トラブルシューティング

衝突を解決するために何度も試みた.
問題はdefault値がprettyerに設定されていることです.
F 1設定を押します.jsに入ってみよう

複数のオプションがあります.
"editor.defaultFormatter": "esbenp.prettier-vscode"
「企業会計準則」に対して注釈処理を行い、借金を解消する.

次に、eslintを次のように基本設定に設定します.

  "editor.formatOnSave": false,
  "eslint.alwaysShowStatus": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.workingDirectories": ["./frontend"],
  "eslint.validate": [
    "javascript",
  ],

それなら上のeslintcjsファイルでプラグインでprettyerを実行する場合は、eslintとprettyerを同時に使用できます.