refactor: migrate app to svelte-kit (#38)

Author: Exeloo

.gitignore

@@ -228,6 +228,7 @@ dist
 # website: https://kit.svelte.dev/
 
 .svelte-kit/
+test-results/
 package
 
 public/

.husky/pre-push

@@ -1,2 +1,3 @@
 pnpm lint
 pnpm build
+pnpm test

.prettierrc

@@ -4,7 +4,7 @@
   "importOrderSeparation": true,
   "importOrderSortSpecifiers": true,
   "importOrderParserPlugins": ["typescript", "decorators-legacy"],
-  "importOrder": ["^~/(.*)$", "^[./]"],
+  "importOrder": ["^$app/(.*)$", "^lib/(.*)$", "^~/(.*)$", "^[./]"],
   "useTabs": false,
   "singleQuote": true,
   "trailingComma": "all",

e2e/demo.test.ts

@@ -0,0 +1,6 @@
+import { expect, test } from '@playwright/test';
+
+test('home page has expected span', async ({ page }) => {
+  await page.goto('/');
+  await expect(page.locator('span')).toBeVisible();
+});

eslint.config.js

@@ -9,13 +9,13 @@ import svelteConfig from './svelte.config.js';
 export default [
   { files: ['src/**/*.{ts}'] },
   { languageOptions: { globals: globals.browser } },
-  { ignores: ['commitlint.config.cjs'] },
 
   pluginJs.configs.recommended,
   ...tseslint.configs.recommended,
   ...tseslint.configs.strict,
   eslintConfigPrettier,
   ...svelte.configs.recommended,
+  ...svelte.configs.prettier,
 
   {
     files: ['**/*.svelte', '**/*.svelte.ts', '**/*.svelte.js'],

index.html

@@ -0,0 +1,4 @@
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "hello_world": "Hello, {name} from en!"
+}

messages/en.json

@@ -0,0 +1,4 @@
+{
+  "$schema": "https://inlang.com/schema/inlang-message-format",
+  "hello_world": "Hello, {name} from fr!"
+}

messages/fr.json

@@ -38,32 +38,40 @@
     "dev": "vite",
     "build": "vite build",
     "preview": "vite preview",
-    "check": "svelte-check --tsconfig tsconfig.app.json && tsc -p tsconfig.node.json",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
     "lint": "prettier --check . && eslint --format=pretty src",
     "format": "prettier --write . && eslint --fix --format=pretty src",
+    "test": "pnpm run test:unit --run",
+    "test:unit": "vitest",
+    "test:e2e": "playwright test",
     "changelog": "git cliff --prepend ./CHANGELOG.md -u -c ./cliff.toml -r . --include-path '.'",
     "release": "cliff-jumper",
     "prepare": "husky"
   },
-  "dependencies": {
-    "monaco-editor": "0.55.1"
-  },
   "devDependencies": {
+    "@alexanderniebuhr/prettier-plugin-unocss": "^0.0.4",
     "@commitlint/cli": "^19.8.0",
     "@commitlint/config-conventional": "^19.8.0",
     "@eslint/js": "^9.23.0",
     "@favware/cliff-jumper": "^6.0.0",
     "@iconify-json/ic": "^1.2.4",
     "@iconify-json/material-icon-theme": "^1.2.27",
     "@iconify-json/solar": "^1.2.4",
+    "@inlang/paraglide-js": "^2.8.0",
     "@nanoforge-dev/actions": "^1.0.2",
+    "@playwright/test": "^1.57.0",
+    "@sveltejs/adapter-auto": "^7.0.0",
+    "@sveltejs/kit": "^2.49.4",
     "@sveltejs/vite-plugin-svelte": "^5.0.3",
     "@trivago/prettier-plugin-sort-imports": "^5.2.2",
     "@tsconfig/svelte": "^5.0.4",
+    "@unocss/extractor-svelte": "^66.5.12",
     "@unocss/preset-icons": "^66.5.1",
     "@unocss/preset-web-fonts": "66.1.0-beta.6",
     "@unocss/preset-wind4": "^66.5.1",
     "@unocss/svelte-scoped": "66.1.0-beta.6",
+    "@vitest/browser-playwright": "^4.0.17",
     "eslint": "^9.23.0",
     "eslint-config-prettier": "^10.1.1",
     "eslint-formatter-pretty": "^7.0.0",
@@ -75,16 +83,19 @@
     "globals": "^16.0.0",
     "husky": "^9.1.7",
     "lint-staged": "^15.5.0",
+    "monaco-editor": "^0.55.1",
+    "playwright": "^1.57.0",
     "prettier": "^3.5.3",
     "prettier-plugin-svelte": "^3.3.3",
     "svelte": "^5.20.2",
     "svelte-check": "^4.1.4",
-    "svelte-routing": "^2.13.0",
     "svelte-sonner": "^1.0.5",
     "typescript": "~5.7.2",
     "typescript-eslint": "^8.27.0",
     "unocss": "66.1.0-beta.6",
-    "vite": "6.3.4"
+    "vite": "6.3.4",
+    "vitest": "^4.0.17",
+    "vitest-browser-svelte": "^2.0.1"
   },
   "packageManager": "[email protected]",
   "engines": {

package.json

@@ -0,0 +1,6 @@
+import { defineConfig } from '@playwright/test';
+
+export default defineConfig({
+  webServer: { command: 'npm run build && npm run preview', port: 4173 },
+  testDir: 'e2e',
+});