-
Notifications
You must be signed in to change notification settings - Fork 1
Tailwind Integration Architecture
WindBeneathYourWings edited this page Apr 10, 2022
·
11 revisions
In this file.
https://github.com/tailwindlabs/tailwindcss/blob/master/src/cli.js
Starting at line 784 is the beginning of the watchers.
The watching is managed by this library.
https://github.com/paulmillr/chokidar
watcher.on('change', async (file) => {
if (contextDependencies.has(file)) {
env.DEBUG && console.time('Resolve config')
context = null
config = refreshConfig(configPath)
env.DEBUG && console.timeEnd('Resolve config')
env.DEBUG && console.time('Watch new files')
let globs = extractFileGlobs(config)
watcher.add(configDependencies)
watcher.add(globs)
env.DEBUG && console.timeEnd('Watch new files')
chain = chain.then(async () => {
changedContent.push(...getChangedContent(config))
await rebuild(config)
})
} else {
chain = chain.then(async () => {
changedContent.push({
content: fs.readFileSync(path.resolve(file), 'utf8'),
extension: path.extname(file).slice(1),
})
await rebuild(config)
})
}
})
watcher.on('add', async (file) => {
chain = chain.then(async () => {
changedContent.push({
content: fs.readFileSync(path.resolve(file), 'utf8'),
extension: path.extname(file).slice(1),
})
await rebuild(config)
})
})
chain = chain.then(() => {
changedContent.push(...getChangedContent(config))
return rebuild(config)
})
}
When a file is added or changed the watcher triggers a chain execution.
I suspect the chain execution is responsible for altering the css rules that are included in the stylesheet.