Create glob patterns for an Angular library with Tailwind CSS and Nx

tailwind.config.js

const { createGlobPatternsForDependencies } = require('@nx/angular/tailwind');
const { join } = require('path');

const { Project } = require('ts-morph');
const { workspaceRoot } = require('nx/src/utils/workspace-root');

/**
 * Get all the library imports from the given paths
 * @param {string} scope
 * @param {string[]} paths
 * @param {Set<`${string}/${string}/${string}`>} prevImports
 * @returns {`${string}/${string}/${string}`[]}
 */
function getLibraryImports(scope, paths, prevImports = new Set()) {
  const project = new Project();

  project.addSourceFilesAtPaths(paths.map((glob) => join(workspaceRoot, glob)));

  /**
   * @type {`${string}/${string}/${string}`[]}
   */
  const imports = project.getSourceFiles().flatMap((sourceFile) =>
    sourceFile
      .getImportDeclarations()
      .filter((importDeclaration) => {
        const moduleSpecifier = importDeclaration.getModuleSpecifierValue();
        return moduleSpecifier.startsWith(scope);
      })
      .map(
        /**
         * @param importDeclaration
         * @returns {`${string}/${string}/${string}`}
         */
        (importDeclaration) => importDeclaration.getModuleSpecifierValue(),
      ),
  );

  return imports.filter((importPath) => !prevImports.has(importPath));
}

/**
 * Get all the library imports from the given paths recursively
 * @param {string} scope
 * @param {string[]} paths
 * @param {Set<`${string}/${string}/${string}`>} prevImports
 * @returns {`${string}/${string}/${string}`[]}
 */
function getLibraryImportsWithNodeModules(
  scope,
  paths,
  prevImports = new Set(),
) {
  const imports = getLibraryImports(scope, paths, prevImports);

  if (imports.length === 0) {
    return Array.from(prevImports);
  }

  imports.forEach((importPath) => prevImports.add(importPath));

  return getLibraryImportsWithNodeModules(
    scope,
    imports.map((importPath) => libraryImportToGlob(importPath)),
    prevImports,
  );
}

/**
 * Convert a library import to a glob pattern
 * @param {`${string}/${string}/${string}`} libraryImport
 * @returns {string}
 */
function libraryImportToGlob(libraryImport) {
  const [scope, packageName, entry] = libraryImport.split('/');
  return join(
    'node_modules',
    scope,
    packageName,
    'esm2022',
    entry,
    '**',
    '*.mjs',
  );
}

/**
 * Create glob patterns for library imports
 * @param {string} scope - The npm scope of the library
 * @param {string[]} paths - Glob patterns to search for library imports
 * @returns {string[]}
 */
function createGlobPatternsForLibrary(scope, paths) {
  return getLibraryImportsWithNodeModules(paths).map((importPath) =>
    join(workspaceRoot, libraryImportToGlob(importPath)),
  );
}

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    join(__dirname, 'src/**/!(*.stories|*.spec).{ts,html}'),
    ...createGlobPatternsForDependencies(__dirname),
    ...createGlobPatternsForLibrary('@your-nmp-scope', [
      'apps/**/*.ts',
      'libs/**/*.ts',
    ]),
  ],
  theme: {
    extend: {},
  },
  plugins: [],
};