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

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.11, we looked at runInit function and how shadcn-ui/ui ensures directories provided in resolvedPaths in config exist.

The following operations are performed in runInit function:

Write cn file

The below code snippet is picked from contains the below code

export const UTILS = \`import { type ClassValue, clsx } from "clsx"

import { twMerge } from "tailwind-merge"



export function cn(...inputs: ClassValue\[\]) {

  return twMerge(clsx(inputs))

}

\`



export const UTILS\_JS = \`import { clsx } from "clsx"

import { twMerge } from "tailwind-merge"



export function cn(...inputs) {

  return twMerge(clsx(inputs))

}

\`

cn utility is literally code returned as a string and written to lib/utils when you run shadcn init.

Conclusion:

templates.UTILS variable in

About me:

Website:

Github: