In my Next.js 14.2.3 app trying to get branding (logo assets) from a CDN on a prerun
and prebuild
but for some reason when I place my script in a directory outside of app along with other directories referenced in tsconfig.json I get a typescript error when running.
the error:
error TS2307: Cannot find module '@api/logos' or its corresponding type declarations.
package.json
"private": true,"type": "module","scripts": {"branding": "tsc utils/branding.ts && node utils/branding.js","prerun": "npm run branding","dev": "npm run prerun && next dev","prebuild": "npm run branding","build": "npm run prebuild && next build","start": "next start","lint": "next lint"},
branding.ts
path: root/utils/branding.ts
contents:
'server only'import { getLogos } from '@api/logos'//;(async function () { const data = await getLogos() console.log({ data }) console.log(true)})()
tsconfig.json
path: root/tsconfig.json
contents:
{"compilerOptions": {"lib": ["dom", "dom.iterable", "esnext"],"allowJs": true,"skipLibCheck": true,"strict": true,"noEmit": true,"esModuleInterop": true,"module": "esnext","moduleResolution": "node","resolveJsonModule": true,"isolatedModules": true,"jsx": "preserve","incremental": true,"plugins": [ {"name": "next" } ],"baseUrl": ".","paths": {"@/*": ["./*"],"@api/*": ["./api/*"],"@types/*": ["./types/*"],"@utils/*": ["./utils/*"] } },"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],"exclude": ["node_modules", "sanity-studio"]}
I know I don't have an issue with the API or API types because I can modify branding.ts to:
'server only'//;(async function () { console.log(true)})()
in page.tsx I can build it out as
path: root/app/page.tsx
contents:
import { getLogos } from '@api/logos'export default async function HomePage() { const logos = await getLogos() console.log({ logos }) return <main>home page</main>}
and the branding.js file is generated in root/utils/
plus it will log true
before build and all the string URLs after build.
Why when trying to run a pre-run
and pre-build
script from package.json I get an error of cannot find module?
Looking at a pre setup so I can dynamically generate the favicon and other branding items before running the build process to write to the public directory.
Is there a better approach to getting API data on a pre-run
or pre-build
for all branding items in a Next.js app if this approach is not possible?