setup dprint formatter

.vscode/settings.json

@@ -0,0 +1,30 @@
+{
+	"files.eol": "\n",
+	"typescript.tsdk": "node_modules/typescript/lib",
+
+	"files.associations": {
+		".env.*": "dotenv",
+		"*.module.css": "scss"
+	},
+
+	"unocss.colorPreview": false,
+	"unocss.remToPxPreview": true,
+	"unocss.autocomplete.matchType": "fuzzy",
+	"unocss.autocomplete.maxItems": 200,
+
+	"editor.defaultFormatter": "dprint.dprint",
+	"editor.formatOnSave": true,
+
+	"javascript.preferences.importModuleSpecifier": "shortest",
+	"typescript.preferences.importModuleSpecifier": "shortest",
+
+	"[prisma]": { "editor.defaultFormatter": "Prisma.prisma" },
+
+	"[typescript]": { "editor.defaultFormatter": "dprint.dprint" },
+	"[typescriptreact]": { "editor.defaultFormatter": "dprint.dprint" },
+	"[javascript]": { "editor.defaultFormatter": "dprint.dprint" },
+	"[javascriptreact]": { "editor.defaultFormatter": "dprint.dprint" },
+
+	"[json]": { "editor.defaultFormatter": "dprint.dprint" },
+	"[jsonc]": { "editor.defaultFormatter": "dprint.dprint" }
+}

app/routes/_index.tsx

@@ -1,16 +1,16 @@
-import type { MetaFunction } from "@remix-run/node";
+import type { MetaFunction } from '@remix-run/node'
 
 export const meta: MetaFunction = () => {
-  return [
-    { title: "Remix workshop" },
-    { name: "description", content: "Welcome to Remix workshop!" },
-  ];
-};
+	return [
+		{ title: 'Remix workshop' },
+		{ name: 'description', content: 'Welcome to Remix workshop!' },
+	]
+}
 
 export default function Index() {
-  return (
-    <div className="flex h-screen items-center justify-center">
-      <p>Hello world</p>
-    </div>
-  );
-}
+	return (
+		<div className="flex h-screen items-center justify-center">
+			<p>Hello world</p>
+		</div>
+	)
+}

dprint.json

@@ -0,0 +1,30 @@
+{
+	"incremental": true,
+	"indentWidth": 2,
+	"useTabs": true,
+	"lineWidth": 180,
+  "typescript": {
+    "useTabs": true,
+		"quoteStyle": "preferSingle",
+		"quoteProps": "asNeeded",
+		"trailingCommas": "onlyMultiLine",
+		"semiColons": "asi",
+		"preferHanging": true,
+		"arrowFunction.useParentheses": "force",
+		"importDeclaration.preferSingleLine": true,
+		"importDeclaration.forceSingleLine": true,
+		"typeLiteral.separatorKind": "semiColon",
+		"jsx.quoteStyle": "preferDouble",
+		"memberExpression.preferSingleLine": false
+  },
+  "json": {},
+  "excludes": [
+    "**/node_modules",
+    "**/*-lock.json",
+		"dist"
+  ],
+  "plugins": [
+    "https://plugins.dprint.dev/typescript-0.93.0.wasm",
+    "https://plugins.dprint.dev/json-0.19.3.wasm"
+  ]
+}

package.json

@@ -25,6 +25,7 @@
     "@typescript-eslint/eslint-plugin": "^6.7.4",
     "@typescript-eslint/parser": "^6.7.4",
     "autoprefixer": "^10.4.19",
+    "dprint": "^0.47.2",
     "eslint": "^8.38.0",
     "eslint-import-resolver-typescript": "^3.6.1",
     "eslint-plugin-import": "^2.28.1",
@@ -40,4 +41,4 @@
   "engines": {
     "node": ">=20.0.0"
   }
-}
+}