shadcn-ui/ui codebase analysis: How does shadcn-ui CLI work? — Part 2.7

#javascript #opensource #nextjs #shadcnui

I wanted to find out how shadcn-ui CLI works. In this article, I discuss the code used to build the shadcn-ui/ui CLI.

In part 2.6, we looked at function getTsConfigAliasPrefix that returns the alias used in paths in your project’s ts-config.json.

Let’s move on to the next line of code.

At L84, it is a simple check that returns null if any of the projectType or tailwindCssFile or tsConfigAliasPrefix does not exist.

Let’s learn more about isTypescriptProject(cwd)

const isTsx = await isTypeScriptProject(cwd)

isTypescriptProject is a function imported from ui/packages/cli/src/utils/get-project-info.ts and this function checks if the cwd (current working directory) has a tsconfig.json file.

export async function isTypeScriptProject(cwd: string) {
  // Check if cwd has a tsconfig.json file.
  return pathExists(path.resolve(cwd, "tsconfig.json"))
}

pathExists

pathExists is a function imported from fs-extra

import fs, { pathExists } from "fs-extra"

Conclusion:

To check if a project uses TypeScript, you could do the same thing that shadcn-ui/ui CLI package does. That is, check if tsconfig.json path exists in the given cwd using pathExists function provided by fs-extra.