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

Remove the watching context (#6858)

Browse source 
* remove watching context

* update changelog
This commit is contained in:
Robin Malfait 2022-01-03 17:45:31 +01:00 • committed by GitHub
parent b9af5a916b
commit 1cbb29faeb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 62 additions and 396 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/index.js
View file

@ -1,5 +1,4 @@
import setupTrackingContext from './lib/setupTrackingContext'
import setupWatchingContext from './lib/setupWatchingContext'
import processTailwindFeatures from './processTailwindFeatures'
import { env } from './lib/sharedState'
@ -14,12 +13,7 @@ module.exports = function tailwindcss(configOrPath) {
return root
},
function (root, result) {
let setupContext =
env.TAILWIND_MODE === 'watch'
? setupWatchingContext(configOrPath)
: setupTrackingContext(configOrPath)
processTailwindFeatures(setupContext)(root, result)
processTailwindFeatures(setupTrackingContext(configOrPath))(root, result)
},
env.DEBUG &&
function (root) {

311
src/lib/setupWatchingContext.js
View file

@ -1,311 +0,0 @@
import fs from 'fs'
import path from 'path'
import tmp from 'tmp'
import chokidar from 'chokidar'
import fastGlob from 'fast-glob'
import LRU from 'quick-lru'
import normalizePath from 'normalize-path'
import hash from '../util/hashConfig'
import log from '../util/log'
import getModuleDependencies from '../lib/getModuleDependencies'
import resolveConfig from '../public/resolve-config'
import resolveConfigPath from '../util/resolveConfigPath'
import { getContext } from './setupContextUtils'
// This is used to trigger rebuilds. Just updating the timestamp
// is significantly faster than actually writing to the file (10x).
function touch(filename) {
let time = new Date()
try {
fs.utimesSync(filename, time, time)
} catch (err) {
fs.closeSync(fs.openSync(filename, 'w'))
}
}
let watchers = new WeakMap()
function getWatcher(context) {
if (watchers.has(context)) {
return watchers.get(context)
}
return null
}
function setWatcher(context, watcher) {
return watchers.set(context, watcher)
}
let touchFiles = new WeakMap()
function getTouchFile(context) {
if (touchFiles.has(context)) {
return touchFiles.get(context)
}
return null
}
function setTouchFile(context, touchFile) {
return touchFiles.set(context, touchFile)
}
let configPaths = new WeakMap()
function getConfigPath(context, configOrPath) {
if (!configPaths.has(context)) {
configPaths.set(context, resolveConfigPath(configOrPath))
}
return configPaths.get(context)
}
function rebootWatcher(context, configPath, configDependencies, candidateFiles) {
let touchFile = getTouchFile(context)
if (touchFile === null) {
touchFile = tmp.fileSync().name
setTouchFile(context, touchFile)
touch(touchFile)
}
let watcher = getWatcher(context)
Promise.resolve(watcher ? watcher.close() : null).then(() => {
log.info([
'Tailwind CSS is watching for changes...',
'https://tailwindcss.com/docs/just-in-time-mode#watch-mode-and-one-off-builds',
])
watcher = chokidar.watch([...candidateFiles, ...configDependencies], {
ignoreInitial: true,
awaitWriteFinish:
process.platform === 'win32'
? {
stabilityThreshold: 50,
pollInterval: 10,
}
: false,
})
setWatcher(context, watcher)
watcher.on('add', (file) => {
let changedFile = path.resolve('.', file)
let content = fs.readFileSync(changedFile, 'utf8')
let extension = path.extname(changedFile).slice(1)
context.changedContent.push({ content, extension })
touch(touchFile)
})
watcher.on('change', (file) => {
// If it was a config dependency, touch the config file to trigger a new context.
// This is not really that clean of a solution but it's the fastest, because we
// can do a very quick check on each build to see if the config has changed instead
// of having to get all of the module dependencies and check every timestamp each
// time.
if (configDependencies.has(file)) {
for (let dependency of configDependencies) {
delete require.cache[require.resolve(dependency)]
}
touch(configPath)
} else {
let changedFile = path.resolve('.', file)
let content = fs.readFileSync(changedFile, 'utf8')
let extension = path.extname(changedFile).slice(1)
context.changedContent.push({ content, extension })
touch(touchFile)
}
})
watcher.on('unlink', (file) => {
// Touch the config file if any of the dependencies are deleted.
if (configDependencies.has(file)) {
for (let dependency of configDependencies) {
delete require.cache[require.resolve(dependency)]
}
touch(configPath)
}
})
})
}
let configPathCache = new LRU({ maxSize: 100 })
let configDependenciesCache = new WeakMap()
function getConfigDependencies(context) {
if (!configDependenciesCache.has(context)) {
configDependenciesCache.set(context, new Set())
}
return configDependenciesCache.get(context)
}
let candidateFilesCache = new WeakMap()
function getCandidateFiles(context, tailwindConfig) {
if (candidateFilesCache.has(context)) {
return candidateFilesCache.get(context)
}
let candidateFiles = tailwindConfig.content.files
.filter((item) => typeof item === 'string')
.map((contentPath) => normalizePath(contentPath))
return candidateFilesCache.set(context, candidateFiles).get(context)
}
// Get the config object based on a path
function getTailwindConfig(configOrPath) {
let userConfigPath = resolveConfigPath(configOrPath)
if (userConfigPath !== null) {
let [prevConfig, prevModified = -Infinity, prevConfigHash] =
configPathCache.get(userConfigPath) || []
let modified = fs.statSync(userConfigPath).mtimeMs
// It hasn't changed (based on timestamp)
if (modified <= prevModified) {
return [prevConfig, userConfigPath, prevConfigHash, [userConfigPath]]
}
// It has changed (based on timestamp), or first run
delete require.cache[userConfigPath]
let newConfig = resolveConfig(require(userConfigPath))
let newHash = hash(newConfig)
configPathCache.set(userConfigPath, [newConfig, modified, newHash])
return [newConfig, userConfigPath, newHash, [userConfigPath]]
}
// It's a plain object, not a path
let newConfig = resolveConfig(
configOrPath.config === undefined ? configOrPath : configOrPath.config
)
return [newConfig, null, hash(newConfig), []]
}
function resolvedChangedContent(context, candidateFiles) {
let changedContent = context.tailwindConfig.content.files
.filter((item) => typeof item.raw === 'string')
.map(({ raw, extension = 'html' }) => ({ content: raw, extension }))
for (let changedFile of resolveChangedFiles(context, candidateFiles)) {
let content = fs.readFileSync(changedFile, 'utf8')
let extension = path.extname(changedFile).slice(1)
changedContent.push({ content, extension })
}
return changedContent
}
let scannedContentCache = new WeakMap()
function resolveChangedFiles(context, candidateFiles) {
let changedFiles = new Set()
// If we're not set up and watching files ourselves, we need to do
// the work of grabbing all of the template files for candidate
// detection.
if (!scannedContentCache.has(context)) {
let files = fastGlob.sync(candidateFiles)
for (let file of files) {
changedFiles.add(file)
}
scannedContentCache.set(context, true)
}
return changedFiles
}
// DISABLE_TOUCH = FALSE
// Retrieve an existing context from cache if possible (since contexts are unique per
// source path), or set up a new one (including setting up watchers and registering
// plugins) then return it
export default function setupWatchingContext(configOrPath) {
return ({ tailwindDirectives, registerDependency }) => {
return (root, result) => {
let [tailwindConfig, userConfigPath, tailwindConfigHash, configDependencies] =
getTailwindConfig(configOrPath)
let contextDependencies = new Set(configDependencies)
// If there are no @tailwind rules, we don't consider this CSS file or it's dependencies
// to be dependencies of the context. Can reuse the context even if they change.
// We may want to think about `@layer` being part of this trigger too, but it's tough
// because it's impossible for a layer in one file to end up in the actual @tailwind rule
// in another file since independent sources are effectively isolated.
if (tailwindDirectives.size > 0) {
// Add current css file as a context dependencies.
contextDependencies.add(result.opts.from)
// Add all css @import dependencies as context dependencies.
for (let message of result.messages) {
if (message.type === 'dependency') {
contextDependencies.add(message.file)
}
}
}
let [context, isNewContext] = getContext(
root,
result,
tailwindConfig,
userConfigPath,
tailwindConfigHash,
contextDependencies
)
let candidateFiles = getCandidateFiles(context, tailwindConfig)
let contextConfigDependencies = getConfigDependencies(context)
for (let file of configDependencies) {
registerDependency({ type: 'dependency', file })
}
context.disposables.push((oldContext) => {
let watcher = getWatcher(oldContext)
if (watcher !== null) {
watcher.close()
}
})
let configPath = getConfigPath(context, configOrPath)
if (configPath !== null) {
for (let dependency of getModuleDependencies(configPath)) {
if (dependency.file === configPath) {
continue
}
contextConfigDependencies.add(dependency.file)
}
}
if (isNewContext) {
rebootWatcher(context, configPath, contextConfigDependencies, candidateFiles)
}
// Register our temp file as a dependency — we write to this file
// to trigger rebuilds.
let touchFile = getTouchFile(context)
if (touchFile) {
registerDependency({ type: 'dependency', file: touchFile })
}
if (tailwindDirectives.size > 0) {
for (let changedContent of resolvedChangedContent(context, candidateFiles)) {
context.changedContent.push(changedContent)
}
}
return context
}
}
}

3
src/lib/sharedState.js
View file

@ -1,9 +1,6 @@
export const env = {
TAILWIND_MODE: process.env.TAILWIND_MODE,
NODE_ENV: process.env.NODE_ENV,
DEBUG: resolveDebug(process.env.DEBUG),
TAILWIND_DISABLE_TOUCH: process.env.TAILWIND_DISABLE_TOUCH !== undefined,
TAILWIND_TOUCH_DIR: process.env.TAILWIND_TOUCH_DIR,
}
export const contextMap = new Map()
export const configContextMap = new Map()