Switch VS Code's Vue extension from Vetur to Volar

.vscode/extensions.json

@@ -2,7 +2,7 @@
 	"recommendations": [
 		"matklad.rust-analyzer",
 		"dbaeumer.vscode-eslint",
-		"octref.vetur",
+		"johnsoncodehk.volar",
 		"formulahendry.auto-close-tag",
 		"aaron-bond.better-comments"
 	]

.vscode/settings.json

@@ -5,22 +5,8 @@
 		"editor.formatOnPaste": true,
 		"editor.defaultFormatter": "matklad.rust-analyzer",
 	},
-	// Web: save on format (consolidate these when https://github.com/microsoft/vscode/issues/51935 is implemented)
+	// Web: save on format
-	"[typescript]": {
+	"[typescript][javascript][vue]": {
-		"editor.codeActionsOnSave": {
-			"source.fixAll.eslint": true,
-		},
-		"editor.formatOnSave": true,
-		"editor.defaultFormatter": "dbaeumer.vscode-eslint",
-	},
-	"[javascript]": {
-		"editor.codeActionsOnSave": {
-			"source.fixAll.eslint": true,
-		},
-		"editor.formatOnSave": true,
-		"editor.defaultFormatter": "dbaeumer.vscode-eslint",
-	},
-	"[vue]": {
 		"editor.codeActionsOnSave": {
 			"source.fixAll.eslint": true,
 		},
@@ -34,14 +20,15 @@
 	// ESLint config
 	"eslint.format.enable": true,
 	"eslint.workingDirectories": [
-		"./frontend",
+		"./frontend"
 	],
 	"eslint.validate": [
 		"javascript",
 		"typescript",
 	],
 	// Vue config
-	"vetur.format.enable": false,
+	"volar.completion.preferredAttrNameCase": "camel",
+	"volar.completion.preferredTagNameCase": "pascal",
 	// VS Code config
 	"html.format.wrapLineLength": 200,
 	"files.eol": "\n",

vetur.config.js

@@ -1,13 +0,0 @@
-// vetur.config.js
-/** @type {import('vls').VeturConfig} */
-module.exports = {
-	// **optional** default: `{}`
-	// override vscode settings
-	// Notice: It only affects the settings used by Vetur.
-	settings: {
-		"vetur.useWorkspaceDependencies": true,
-	},
-	// **optional** default: `[{ root: './' }]`
-	// support monorepos
-	projects: ['./frontend']
-}