Open13
eslintのflat configでいい感じにvueのlintをしたい
pnpm create vite@latest
適当にts/vueを選ぶ
cd proj
pnpm install
pnpm add eslint --save-dev
eslintをいれる
pnpm add --save-dev @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-plugin-vue vue-eslint-parser
必要そうなものをいれる
flat configについて
それっぽく書いてみる
import typescriptEslint from "@typescript-eslint/eslint-plugin";
import typescriptParser from "@typescript-eslint/parser";
import vueEslint from "eslint-plugin-vue"
import vueParser from "vue-eslint-parser"
export default [
"eslint:recommended",
{
files: ["src/**/*.vue"],
languageOptions: {
parser: vueParser,
parserOptions: {
parser: typescriptParser,
},
},
plugins: {
vue: vueEslint,
},
rules: {
...vueEslint.configs["vue3-essential"].rules,
...vueEslint.configs["vue3-recommended"].rules,
...vueEslint.configs["vue3-strongly-recommended"].rules,
}
}
];
pnpm eslint src/components/*.vue
/tmp/proj/src/components/HelloWorld.vue
13:27 warning '@click' should be on a new line
vue/max-attributes-per-line
13:44 warning Expected 1 line break after opening tag (`<button>`), but no line
breaks found vue/singleline-html-element-content-newline
13:64 warning Expected 1 line break before closing tag (`</button>`), but no lin
e breaks found vue/singleline-html-element-content-newline
22:62 warning 'target' should be on a new line
vue/max-attributes-per-line
22:77 warning Expected no line breaks before closing bracket, but 1 line break f
ound vue/html-closing-bracket-newline
23:1 warning Expected indentation of 4 spaces but found 6 spaces
vue/html-indent
23:21 warning Expected no line breaks before closing bracket, but 1 line break f
ound vue/html-closing-bracket-newline
28:54 warning 'target' should be on a new line
vue/max-attributes-per-line
31:28 warning Expected 1 line break after opening tag (`<p>`), but no line break
s found vue/singleline-html-element-content-newline
31:73 warning Expected 1 line break before closing tag (`</p>`), but no line bre
aks found vue/singleline-html-element-content-newline
✖ 10 problems (0 errors, 10 warnings)
0 errors and 10 warnings potentially fixable with the `--fix` option.
動いてる??
参考:
rulesが気持ち悪いなあ
うーん
window.~~~系がno-undef
で弾かれるなあ
env
に当たるものがないのでglobal
無理やりやるしかないのかねえ
こんな感じでよさそう?
import ts from "@typescript-eslint/eslint-plugin"
import tsParser from "@typescript-eslint/parser"
import vueParser from "vue-eslint-parser"
import vue from "eslint-plugin-vue"
import prettier from "eslint-config-prettier"
export default [
{
rules: {
complexity: ["warn", { max: 15 }],
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
},
},
{
files: ["**/*.ts", "**/*.vue"],
plugins: {
"@typescript-eslint": ts,
},
rules: {
...ts.configs["recommended"].rules,
...ts.configs["eslint-recommended"].rules,
"@typescript-eslint/no-unused-vars": [
"warn",
{
argsIgnorePattern: "^_",
varsIgnorePattern: "^_",
caughtErrorsIgnorePattern: "^_",
destructuredArrayIgnorePattern: "^_",
},
],
},
},
{
files: ["**/*.ts"],
languageOptions: {
parser: tsParser,
},
},
{
files: ["**/*.vue"],
languageOptions: {
parser: vueParser,
parserOptions: {
parser: {
ts: tsParser,
tsx: tsParser,
},
ecmaVersion: "latest",
},
},
plugins: {
vue,
},
rules: {
...vue.configs["vue3-recommended"].rules,
},
},
{
rules: {
...prettier.rules,
},
},
]
なんかいらないパラメータつけてそうな気がする
fyi: プラグインの内部構造に依存してるのでもう動かないかも