wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Don't block on module dependency resolution

Browse source
This commit is contained in:
Philipp Spiess 2024-08-26 16:37:06 +02:00
parent 85d6da4884
commit 8c43650798
4 changed files with 43 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

18
packages/@tailwindcss-cli/src/commands/build/index.ts
View file

@ -132,7 +132,7 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
let inputFile = args['--input'] && args['--input'] !== '-' ? args['--input'] : process.cwd()
let inputBasePath = path.dirname(path.resolve(inputFile))
let fullRebuildPaths = [...cssImportPaths]
let fullRebuildPaths: Promise<string[]>[] = [Promise.resolve(cssImportPaths)]
function compile(css: string) {
return tailwindcss.compile(css, {
@ -142,8 +142,8 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
}
let resolvedPath = path.resolve(inputBasePath, pluginPath)
fullRebuildPaths.push(resolvedPath)
fullRebuildPaths.push(...(await getModuleDependencies(resolvedPath)))
fullRebuildPaths.push(Promise.resolve([resolvedPath]))
fullRebuildPaths.push(getModuleDependencies(resolvedPath))
return import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()).then(
(m) => m.default ?? m,
)
@ -155,8 +155,8 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
}
let resolvedPath = path.resolve(inputBasePath, configPath)
fullRebuildPaths.push(resolvedPath)
fullRebuildPaths.push(...(await getModuleDependencies(resolvedPath)))
fullRebuildPaths.push(Promise.resolve([resolvedPath]))
fullRebuildPaths.push(getModuleDependencies(resolvedPath))
return import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()).then(
(m) => m.default ?? m,
)
@ -187,11 +187,13 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
let changedFiles: ChangedContent[] = []
let rebuildStrategy: 'incremental' | 'full' = 'incremental'
let resolvedFullRebuildPaths = (await Promise.all(fullRebuildPaths)).flat()
for (let file of files) {
// If one of the changed files is related to the input CSS or JS
// config/plugin files, then we need to do a full rebuild because
// the theme might have changed.
if (fullRebuildPaths.includes(file)) {
if (resolvedFullRebuildPaths.includes(file)) {
rebuildStrategy = 'full'
// No need to check the rest of the events, because we already know we
@ -226,8 +228,8 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
`,
args['--input'] ?? base,
)
clearRequireCache(fullRebuildPaths)
fullRebuildPaths = cssImportPaths
clearRequireCache(resolvedFullRebuildPaths)
fullRebuildPaths = [Promise.resolve(cssImportPaths)]
// Create a new compiler, given the new `input`
compiler = await compile(input)

2
packages/@tailwindcss-node/src/get-module-dependencies.ts
View file

@ -102,5 +102,5 @@ export async function getModuleDependencies(absoluteFilePath: string) {
path.extname(absoluteFilePath),
)
return seen
return Array.from(seen)
}

32
packages/@tailwindcss-postcss/src/index.ts
View file

@ -49,7 +49,7 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
compiler: null as null | Awaited<ReturnType<typeof compile>>,
css: '',
optimizedCss: '',
fullRebuildPaths: [] as string[],
fullRebuildPaths: [] as Promise<string[]>[],
}
})
@ -84,8 +84,10 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
let context = cache.get(inputFile)
let inputBasePath = path.dirname(path.resolve(inputFile))
function createCompiler() {
clearRequireCache(context.fullRebuildPaths)
async function createCompiler() {
for (let files of await Promise.all(context.fullRebuildPaths)) {
clearRequireCache(files)
}
context.fullRebuildPaths = []
return compile(root.toString(), {
loadPlugin: async (pluginPath) => {
@ -94,8 +96,8 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
}
let resolvedPath = path.resolve(inputBasePath, pluginPath)
context.fullRebuildPaths.push(resolvedPath)
context.fullRebuildPaths.push(...(await getModuleDependencies(resolvedPath)))
context.fullRebuildPaths.push(Promise.resolve([resolvedPath]))
context.fullRebuildPaths.push(getModuleDependencies(resolvedPath))
return import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()).then(
(m) => m.default ?? m,
)
@ -107,8 +109,8 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
}
let resolvedPath = path.resolve(inputBasePath, configPath)
context.fullRebuildPaths.push(resolvedPath)
context.fullRebuildPaths.push(...(await getModuleDependencies(resolvedPath)))
context.fullRebuildPaths.push(Promise.resolve([resolvedPath]))
context.fullRebuildPaths.push(getModuleDependencies(resolvedPath))
return import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()).then(
(m) => m.default ?? m,
)
@ -124,13 +126,15 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
// Track file modification times to CSS files
{
for (let file of context.fullRebuildPaths) {
result.messages.push({
type: 'dependency',
plugin: '@tailwindcss/postcss',
file,
parent: result.opts.from,
})
for (let files of await Promise.all(context.fullRebuildPaths)) {
for (let file of files) {
result.messages.push({
type: 'dependency',
plugin: '@tailwindcss/postcss',
file,
parent: result.opts.from,
})
}
}
let files = result.messages.flatMap((message) => {

22
packages/@tailwindcss-vite/src/index.ts
View file

@ -95,15 +95,18 @@ export default function tailwindcss(): Plugin[] {
}
let resolvedPath = path.resolve(inputBasePath, pluginPath)
let [module, moduleDependencies] = await Promise.all([
import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()),
getModuleDependencies(resolvedPath),
])
addWatchFile(resolvedPath)
fullRebuildPaths.push(resolvedPath)
for (let file of await getModuleDependencies(resolvedPath)) {
for (let file of moduleDependencies) {
addWatchFile(file)
fullRebuildPaths.push(file)
}
return import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()).then(
(m) => m.default ?? m,
)
return module.default ?? module
},
loadConfig: async (configPath) => {
@ -112,15 +115,18 @@ export default function tailwindcss(): Plugin[] {
}
let resolvedPath = path.resolve(inputBasePath, configPath)
let [module, moduleDependencies] = await Promise.all([
import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()),
getModuleDependencies(resolvedPath),
])
addWatchFile(resolvedPath)
fullRebuildPaths.push(resolvedPath)
for (let file of await getModuleDependencies(resolvedPath)) {
for (let file of moduleDependencies) {
addWatchFile(file)
fullRebuildPaths.push(file)
}
return import(pathToFileURL(resolvedPath).href + '?id=' + Date.now()).then(
(m) => m.default ?? m,
)
return module.default ?? module
},
})