-
Notifications
You must be signed in to change notification settings - Fork 2.2k
/
tailwindcss.ts
95 lines (81 loc) · 2.45 KB
/
tailwindcss.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
import { logger } from '@nrwl/devkit';
import { workspaceRoot } from '@nrwl/devkit';
import { existsSync } from 'fs';
import { join, relative } from 'path';
import * as postcssImport from 'postcss-import';
export interface TailwindSetup {
tailwindConfigPath: string;
tailwindPackagePath: string;
}
export const tailwindDirectives = [
'@tailwind',
'@apply',
'@layer',
'@variants',
'@responsive',
'@screen',
];
export function getTailwindSetup(
basePath: string,
tailwindConfig?: string
): TailwindSetup | undefined {
let tailwindConfigPath = tailwindConfig;
if (!tailwindConfigPath) {
tailwindConfigPath = getTailwindConfigPath(basePath, workspaceRoot);
}
// Only load Tailwind CSS plugin if configuration file was found.
if (!tailwindConfigPath) {
return undefined;
}
let tailwindPackagePath: string | undefined;
try {
tailwindPackagePath = require.resolve('tailwindcss');
} catch {
const relativeTailwindConfigPath = relative(
workspaceRoot,
tailwindConfigPath
);
logger.warn(
`Tailwind CSS configuration file found (${relativeTailwindConfigPath})` +
` but the 'tailwindcss' package is not installed.` +
` To enable Tailwind CSS, please install the 'tailwindcss' package.`
);
return undefined;
}
if (!tailwindPackagePath) {
return undefined;
}
return { tailwindConfigPath, tailwindPackagePath };
}
function getTailwindConfigPath(
projectRoot: string,
workspaceRoot: string
): string | undefined {
// valid tailwind config files https://github.com/tailwindlabs/tailwindcss/blob/master/src/util/resolveConfigPath.js#L46
const tailwindConfigFiles = ['tailwind.config.js', 'tailwind.config.cjs'];
for (const basePath of [projectRoot, workspaceRoot]) {
for (const configFile of tailwindConfigFiles) {
const fullPath = join(basePath, configFile);
if (existsSync(fullPath)) {
return fullPath;
}
}
}
return undefined;
}
export function getTailwindPostCssPlugins(
{ tailwindConfigPath, tailwindPackagePath }: TailwindSetup,
includePaths?: string[],
watch?: boolean
) {
if (process.env['TAILWIND_MODE'] === undefined) {
process.env['TAILWIND_MODE'] = watch ? 'watch' : 'build';
}
return [
postcssImport({
addModulesDirectories: includePaths ?? [],
resolve: (url: string) => (url.startsWith('~') ? url.substring(1) : url),
}),
require(tailwindPackagePath)({ config: tailwindConfigPath }),
];
}