Use JSDOM alternative for deploying to Vercel

.eslintrc.cjs

@@ -1,6 +1,9 @@
 /** @type {import('@typescript-eslint/utils').TSESLint.Linter.Config} */
 const config = {
   extends: ['upleveled'],
+  globals: {
+    NodeJS: true,
+  },
 };
 
 module.exports = config;

app/LinkIfNotCurrent.tsx

@@ -2,12 +2,14 @@
 
 import Link, { LinkProps } from 'next/link';
 import { usePathname } from 'next/navigation';
+import { ReactNode } from 'react';
 
 export default function LinkIfNotCurrent<RouteType>({
   matchParentSegment,
   ...props
 }: LinkProps<RouteType> & {
   matchParentSegment?: boolean;
+  children: ReactNode;
 }) {
   const pathname = usePathname();
 

app/example-6-cross-site-scripting/solution-2/page.tsx

@@ -1,5 +1,5 @@
 import DOMPurify from 'dompurify';
-import { JSDOM } from 'jsdom';
+import { JSDOM } from 'jsdom-napi-rs-canvas';
 import { notFound } from 'next/navigation';
 import { getBlogPostById } from '../../../database/blogPosts';
 import Common from '../common';

database/connect.ts

@@ -15,7 +15,7 @@ declare module globalThis {
 function connectOneTimeToDatabase() {
   if (!globalThis.postgresSqlClient) {
     globalThis.postgresSqlClient = postgres({
-      ssl: !!process.env.POSTGRES_URL,
+      ssl: Boolean(process.env.POSTGRES_URL),
       transform: {
         ...postgres.camel,
         undefined: null,