Search code examples
typescriptbuildconfigastrojs

Astro Build Error, Markdown with Typescript

When I try to build my Astro Project with npm run build or go to one of my markdown pages after running: npm run dev I run into this Error:

> [email protected] build
> astro build

17:42:55 [build] output target: static   
17:42:55 [build] Collecting build info...
17:42:55 [build] Completed in 47ms.
17:42:55 [build] Building static entrypoints...
[vite:esbuild] failed to resolve "extends":"astro/tsconfigs/strict" in C:\Users\felix\documents\programmieren\hhh\tsconfig.json
file: C:/Users/felix/documents/programmieren/hhh/src/utils/getPostData.ts
 error   failed to resolve "extends":"astro/tsconfigs/strict" in C:\Users\felix\documents\programmieren\hhh\tsconfig.json
  File:
    C:/Users/felix/documents/programmieren/hhh/src/utils/getPostData.ts
  Stacktrace:
    at resolveExtends (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/astro/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:13162:9)    
    at parseExtends (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/astro/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:13135:34)     
    at parse$g (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/astro/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:13086:24)
js:13557:24)
    at async transformWithEsbuild (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/astro/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:13280:36)
    at async Object.transform (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/astro/node_modules/vite/dist/node/chunks/dep-5cb728cb.js:13379:32)
    at async transform (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/rollup/dist/es/shared/rollup.js:21911:16)
    at async ModuleLoader.addModuleSource (file:///C:/Users/felix/Documents/Programmieren/hhh/node_modules/rollup/dist/es/shared/rollup.js:22136:30)

There seems to be an issue with the tsconfig.json file so I tried to switch the tsconfig.json file from:

{
  "compilerOptions": {
    // Enable top-level await, and other modern ESM features.
    "target": "ESNext",
    "module": "ESNext",
    // Enable node-style module resolution, for things like npm package imports.
    "moduleResolution": "node",
    // Enable JSON imports.
    "resolveJsonModule": true,
    // Enable stricter transpilation for better output.
    "isolatedModules": true,
    // Astro will directly run your TypeScript code, no transpilation needed.
    "noEmit": true
  },
  "extends": "astro/tsconfigs/strict"
}

to:

{
  "extends": "astro/tsconfigs/strict",
  "include": ["**/*.ts", "**/*.tsx", "**/*.jsx"],
  "exclude": ["node_modules", "studio"],
  "compilerOptions": {
    "types": ["astro/client"],
    "target": "ESNext",
    "module": "ESNext",
    // Enable node-style module resolution, for things like npm package imports.
    "moduleResolution": "node",
    // Enable JSON imports.
    "resolveJsonModule": true,
    // Enable stricter transpilation for better output.
    "isolatedModules": true,
    // Astro will directly run your TypeScript code, no transpilation needed.
    "noEmit": true,
    "baseUrl": "/",
    "paths": {
      "@components/*": ["src/components/*"],
      "@layouts/*": ["src/layouts/*"]
    }
  }
}

When running npm run dev this seems to fix the problem (sometimes?), but with npm run build it still throws the above error. I am quite new to Typescript so a thorough explaination is apprechiated. The projects source is found on github. How can I remove this error?

Solution

  • Just as the compiler said, there was a problem with "extends": "astro/tsconfigs/strict". It could not locate the resource. I do not know why. I fixed it by directly replacing the former tsconfig.json file with the file it should have extended and manually adding the properties not already contained. You can refer to their typescript documentation page on how their tsbuild.json files work. The files were found on their GitHub.