diff --git a/.eslintrc.js b/.eslintrc.cjs similarity index 100% rename from .eslintrc.js rename to .eslintrc.cjs diff --git a/app/root.tsx b/app/root.tsx index f6d047a18..cdda99208 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -16,11 +16,11 @@ import { useMatches, useRouteLoaderData, } from "@remix-run/react"; -import stylesheet from "~/styles.css"; -import fontsStylesheet from "@digitalservice4germany/angie/fonts.css"; -import fontRegular from "~/../public/fonts/BundesSansWeb-Regular.woff2"; -import fontBold from "~/../public/fonts/BundesSansWeb-Bold.woff2"; -import ogImage from "~/../public/og-image.png"; +import "~/styles.css"; +import "@digitalservice4germany/angie/fonts.css"; +import fontRegular from "/fonts/BundesSansWeb-Regular.woff2"; +import fontBold from "/fonts/BundesSansWeb-Bold.woff2"; +import ogImage from "/og-image.png"; import { withSentry } from "@sentry/remix"; import { config as configWeb } from "~/services/env/web"; import { @@ -70,8 +70,6 @@ export const links: LinksFunction = () => [ href: fontBold, crossOrigin: "anonymous", }, - { rel: "stylesheet", href: fontsStylesheet }, - { rel: "stylesheet", href: stylesheet }, { rel: "icon", href: "/favicon.ico", sizes: "32x32" }, { rel: "icon", href: "/favicon.svg", type: "image/svg+xml" }, { rel: "apple-touch-icon", href: "/apple-touch-icon.png", sizes: "180x180" }, diff --git a/remix.env.d.ts b/env.d.ts similarity index 50% rename from remix.env.d.ts rename to env.d.ts index dcf8c45e1..8d2f95181 100644 --- a/remix.env.d.ts +++ b/env.d.ts @@ -1,2 +1,2 @@ -/// +/// /// diff --git a/jest.config.js b/jest.config.cjs similarity index 63% rename from jest.config.js rename to jest.config.cjs index df156c090..aebb7b3ec 100644 --- a/jest.config.js +++ b/jest.config.cjs @@ -4,10 +4,10 @@ module.exports = { moduleNameMapper: { "~/(.*)": "/app/$1", "tests/(.*)": "/tests/$1", - "^.+\\.css$": "/tests/cssStub.js", + "^.+\\.css$": "/tests/cssStub.cjs", }, preset: "ts-jest", setupFiles: ["/tests/setup.tests.ts"], - setupFilesAfterEnv: ["/tests/setupAfterEnv.tests.js"], - resolver: "/tests/resolver.js", + setupFilesAfterEnv: ["/tests/setupAfterEnv.tests.cjs"], + resolver: "/tests/resolver.cjs", }; diff --git a/package-lock.json b/package-lock.json index d31eca8fd..4441beda8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -89,7 +89,10 @@ "tailwindcss": "^3.4.1", "ts-jest": "^29.1.2", "ts-node": "^10.9.2", - "typescript": "^5.3.3" + "typescript": "^5.3.3", + "vite": "^5.0.12", + "vite-plugin-cjs-interop": "^2.0.3", + "vite-tsconfig-paths": "^4.3.1" }, "engines": { "node": ">=20" @@ -15856,6 +15859,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/globrex": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz", + "integrity": "sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==", + "dev": true + }, "node_modules/gopd": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", @@ -26734,6 +26743,26 @@ "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==", "dev": true }, + "node_modules/tsconfck": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/tsconfck/-/tsconfck-3.0.1.tgz", + "integrity": "sha512-7ppiBlF3UEddCLeI1JRx5m2Ryq+xk4JrZuq4EuYXykipebaq1dV0Fhgr1hb7CkmHt32QSgOZlcqVLEtHBG4/mg==", + "dev": true, + "bin": { + "tsconfck": "bin/tsconfck.js" + }, + "engines": { + "node": "^18 || >=20" + }, + "peerDependencies": { + "typescript": "^5.0.0" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, "node_modules/tsconfig-paths": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-4.2.0.tgz", @@ -27641,6 +27670,49 @@ "url": "https://opencollective.com/vitest" } }, + "node_modules/vite-plugin-cjs-interop": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/vite-plugin-cjs-interop/-/vite-plugin-cjs-interop-2.0.3.tgz", + "integrity": "sha512-5nYYWzYvx4CpbHlPLaDteWrwmx4XnZnhpM6BvDpmD4rbkJeeNzvGfdNDhr3AccBA//Uqf3SOjsJvU+7fUlnifg==", + "dev": true, + "dependencies": { + "acorn": "^8.11.3", + "estree-walker": "^3.0.3", + "magic-string": "^0.30.5", + "minimatch": "^9.0.3" + } + }, + "node_modules/vite-plugin-cjs-interop/node_modules/acorn": { + "version": "8.11.3", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz", + "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==", + "dev": true, + "bin": { + "acorn": "bin/acorn" + }, + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/vite-tsconfig-paths": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/vite-tsconfig-paths/-/vite-tsconfig-paths-4.3.1.tgz", + "integrity": "sha512-cfgJwcGOsIxXOLU/nELPny2/LUD/lcf1IbfyeKTv2bsupVbTH/xpFtdQlBmIP1GEK2CjjLxYhFfB+QODFAx5aw==", + "dev": true, + "dependencies": { + "debug": "^4.1.1", + "globrex": "^0.1.2", + "tsconfck": "^3.0.1" + }, + "peerDependencies": { + "vite": "*" + }, + "peerDependenciesMeta": { + "vite": { + "optional": true + } + } + }, "node_modules/vite/node_modules/@esbuild/android-arm": { "version": "0.19.12", "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.19.12.tgz", diff --git a/package.json b/package.json index 93eed0f87..ed65f1ef2 100644 --- a/package.json +++ b/package.json @@ -9,10 +9,12 @@ "license": "MIT", "private": true, "sideEffects": false, + "type": "module", "scripts": { - "build": "remix build", "build-storybook": "storybook build --output-dir=public/storybook", - "dev": "remix dev", + "dev": "remix vite:dev", + "build": "remix vite:build", + "start": "remix-serve ./build/server/index.js", "dumpCmsToFile": "ts-node ./app/services/cms/dumpCmsToFile.ts dumpCmsToFile", "eslint": "eslint . --fix", "eslint:check": "eslint --cache .", @@ -21,7 +23,6 @@ "init": "lefthook install", "prettier": "prettier --write . --ignore-path .prettierignore", "prettier:check": "prettier --check . --ignore-path .prettierignore", - "start": "remix-serve build", "storybook": "storybook dev -p 6006", "test": "jest --testPathPattern=/tests/unit/ --maxWorkers=50%", "test:coverage": "jest --testPathPattern=/tests/unit/ --maxWorkers=50% --coverage --collectCoverageFrom='./app/**'", @@ -117,7 +118,10 @@ "tailwindcss": "^3.4.1", "ts-jest": "^29.1.2", "ts-node": "^10.9.2", - "typescript": "^5.3.3" + "typescript": "^5.3.3", + "vite": "^5.0.12", + "vite-plugin-cjs-interop": "^2.0.3", + "vite-tsconfig-paths": "^4.3.1" }, "engines": { "node": ">=20" diff --git a/postcss.config.js b/postcss.config.cjs similarity index 100% rename from postcss.config.js rename to postcss.config.cjs diff --git a/tailwind.config.js b/tailwind.config.cjs similarity index 100% rename from tailwind.config.js rename to tailwind.config.cjs diff --git a/tests/cssStub.js b/tests/cssStub.cjs similarity index 100% rename from tests/cssStub.js rename to tests/cssStub.cjs diff --git a/tests/resolver.js b/tests/resolver.cjs similarity index 100% rename from tests/resolver.js rename to tests/resolver.cjs diff --git a/tests/setupAfterEnv.tests.js b/tests/setupAfterEnv.tests.cjs similarity index 100% rename from tests/setupAfterEnv.tests.js rename to tests/setupAfterEnv.tests.cjs diff --git a/tsconfig.json b/tsconfig.json index 9d377967e..b6e262a29 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,5 +1,5 @@ { - "include": ["remix.env.d.ts", "app/", "tests/", "stories/"], + "include": ["env.d.ts", "app/", "tests/", "stories/"], "compilerOptions": { "preserveSymlinks": true, "incremental": true, @@ -9,6 +9,7 @@ "esModuleInterop": true, "allowSyntheticDefaultImports": true, "jsx": "react-jsx", + "module": "ESNext", "moduleResolution": "Bundler", "resolveJsonModule": true, "target": "ES2022", diff --git a/vite.config.ts b/vite.config.ts new file mode 100644 index 000000000..4444a99cb --- /dev/null +++ b/vite.config.ts @@ -0,0 +1,21 @@ +import { unstable_vitePlugin as remix } from "@remix-run/dev"; +import { installGlobals } from "@remix-run/node"; +import { defineConfig } from "vite"; +import tsconfigPaths from "vite-tsconfig-paths"; +import { cjsInterop } from "vite-plugin-cjs-interop"; + +installGlobals(); +const isStorybook = process.argv[1]?.includes("storybook"); + +export default defineConfig({ + server: { + port: 3000, + }, + plugins: [ + !isStorybook && remix(), + tsconfigPaths(), + cjsInterop({ + dependencies: ["react-dropzone", "@digitalservicebund/icons/*"], + }), + ], +});