I'm new to React and could use some assistance with a deployment issue on Vercel. Any ideas on why this is failing?
I haven't explicitly used AbortController anywhere, so I'm suspecting it might be related to one of the installed packages?
Repository: Github Repo
The project works fine in development mode.
//tsconfig.json
{
"include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
"compilerOptions": {
"lib": ["DOM", "DOM.Iterable", "ES2022"],
"isolatedModules": true,
"esModuleInterop": true,
"jsx": "react-jsx",
"moduleResolution": "Bundler",
"resolveJsonModule": true,
"target": "ES2022",
"strict": true,
"allowJs": true,
"forceConsistentCasingInFileNames": true,
"baseUrl": ".",
"paths": {
"~/*": ["./app/*"]
},
// Remix takes care of building everything in `remix build`.
"noEmit": true
}
}
//package.json
{
"name": "country-app",
"private": true,
"sideEffects": false,
"type": "module",
"scripts": {
"build": "npm run build:css && remix build",
"build:css": "tailwindcss -o ./app/tailwind.css",
"dev": "concurrently \"npm run dev:css\" \"remix dev\"",
"dev:css": "tailwindcss -i ./app/global.css -o ./app/tailwind.css --watch",
"start": "remix-serve ./build/index.js",
"typecheck": "tsc"
},
"dependencies": {
"@headlessui/react": "^1.7.17",
"@heroicons/react": "^2.0.18",
"@remix-run/css-bundle": "^2.0.0",
"@remix-run/node": "^2.0.0",
"@remix-run/react": "^2.0.0",
"@remix-run/serve": "^2.0.0",
"clsx": "^2.0.0",
"concurrently": "^8.2.1",
"isbot": "^3.6.8",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"remix-utils": "^6.6.0",
"tailwindcss": "^3.3.3"
},
"devDependencies": {
"@remix-run/dev": "^2.0.0",
"@types/react": "^18.2.20",
"@types/react-dom": "^18.2.7",
"prettier": "^3.0.3",
"typescript": "^5.1.6"
},
"engines": {
"node": "18"
}
}
file:///var/task/build/server-build-nodejs-eyJydW50aW1lIjoibm9kZWpzIn0.mjs:2
AbortController as NodeAbortController,
^^^^^^^^^^^^^^^
SyntaxError: Named export 'AbortController' not found. The requested module '@remix-run/node' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:
import pkg from '@remix-run/node';
at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:190:5)
RequestId: 12ff4058-63d5-40e3-8dde-8394bd9eb5a2 Error: Runtime exited with error: exit status 1
Runtime.ExitError
I've attempted downgrading both the remix and nodejs versions in case there was an issue with something included in those packages, but that doesn't seem to be the solution.
Any assistance would be greatly appreciated. Thank you :)