source: frontend/node_modules/tailwindcss/src/lib/content.js

Last change on this file was 9af201e, checked in by MBK <marija.karapandzova@…>, 12 days ago

Fix frontend appearance

  • Property mode set to 100644
File size: 9.0 KB
RevLine 
[9af201e]1// @ts-check
2
3import fs from 'fs'
4import path from 'path'
5import isGlob from 'is-glob'
6import fastGlob from 'fast-glob'
7import normalizePath from 'normalize-path'
8import { parseGlob } from '../util/parseGlob'
9import { env } from './sharedState'
10import log from '../util/log'
11import micromatch from 'micromatch'
12
13/** @typedef {import('../../types/config.js').RawFile} RawFile */
14/** @typedef {import('../../types/config.js').FilePath} FilePath */
15
16/**
17 * @typedef {object} ContentPath
18 * @property {string} original
19 * @property {string} base
20 * @property {string | null} glob
21 * @property {boolean} ignore
22 * @property {string} pattern
23 */
24
25/**
26 * Turn a list of content paths (absolute or not; glob or not) into a list of
27 * absolute file paths that exist on the filesystem
28 *
29 * If there are symlinks in the path then multiple paths will be returned
30 * one for the symlink and one for the actual file
31 *
32 * @param {*} context
33 * @param {import('tailwindcss').Config} tailwindConfig
34 * @returns {ContentPath[]}
35 */
36export function parseCandidateFiles(context, tailwindConfig) {
37 let files = tailwindConfig.content.files
38
39 // Normalize the file globs
40 files = files.filter((filePath) => typeof filePath === 'string')
41 files = files.map(normalizePath)
42
43 // Split into included and excluded globs
44 let tasks = fastGlob.generateTasks(files)
45
46 /** @type {ContentPath[]} */
47 let included = []
48
49 /** @type {ContentPath[]} */
50 let excluded = []
51
52 for (const task of tasks) {
53 included.push(...task.positive.map((filePath) => parseFilePath(filePath, false)))
54 excluded.push(...task.negative.map((filePath) => parseFilePath(filePath, true)))
55 }
56
57 let paths = [...included, ...excluded]
58
59 // Resolve paths relative to the config file or cwd
60 paths = resolveRelativePaths(context, paths)
61
62 // Resolve symlinks if possible
63 paths = paths.flatMap(resolvePathSymlinks)
64
65 // Update cached patterns
66 paths = paths.map(resolveGlobPattern)
67
68 return paths
69}
70
71/**
72 *
73 * @param {string} filePath
74 * @param {boolean} ignore
75 * @returns {ContentPath}
76 */
77function parseFilePath(filePath, ignore) {
78 let contentPath = {
79 original: filePath,
80 base: filePath,
81 ignore,
82 pattern: filePath,
83 glob: null,
84 }
85
86 if (isGlob(filePath)) {
87 Object.assign(contentPath, parseGlob(filePath))
88 }
89
90 return contentPath
91}
92
93/**
94 *
95 * @param {ContentPath} contentPath
96 * @returns {ContentPath}
97 */
98function resolveGlobPattern(contentPath) {
99 // This is required for Windows support to properly pick up Glob paths.
100 // Afaik, this technically shouldn't be needed but there's probably
101 // some internal, direct path matching with a normalized path in
102 // a package which can't handle mixed directory separators
103 let base = normalizePath(contentPath.base)
104
105 // If the user's file path contains any special characters (like parens) for instance fast-glob
106 // is like "OOOH SHINY" and treats them as such. So we have to escape the base path to fix this
107 base = fastGlob.escapePath(base)
108
109 contentPath.pattern = contentPath.glob ? `${base}/${contentPath.glob}` : base
110 contentPath.pattern = contentPath.ignore ? `!${contentPath.pattern}` : contentPath.pattern
111
112 return contentPath
113}
114
115/**
116 * Resolve each path relative to the config file (when possible) if the experimental flag is enabled
117 * Otherwise, resolve relative to the current working directory
118 *
119 * @param {any} context
120 * @param {ContentPath[]} contentPaths
121 * @returns {ContentPath[]}
122 */
123function resolveRelativePaths(context, contentPaths) {
124 let resolveFrom = []
125
126 // Resolve base paths relative to the config file (when possible) if the experimental flag is enabled
127 if (context.userConfigPath && context.tailwindConfig.content.relative) {
128 resolveFrom = [path.dirname(context.userConfigPath)]
129 }
130
131 return contentPaths.map((contentPath) => {
132 contentPath.base = path.resolve(...resolveFrom, contentPath.base)
133
134 return contentPath
135 })
136}
137
138/**
139 * Resolve the symlink for the base directory / file in each path
140 * These are added as additional dependencies to watch for changes because
141 * some tools (like webpack) will only watch the actual file or directory
142 * but not the symlink itself even in projects that use monorepos.
143 *
144 * @param {ContentPath} contentPath
145 * @returns {ContentPath[]}
146 */
147function resolvePathSymlinks(contentPath) {
148 let paths = [contentPath]
149
150 try {
151 let resolvedPath = fs.realpathSync(contentPath.base)
152 if (resolvedPath !== contentPath.base) {
153 paths.push({
154 ...contentPath,
155 base: resolvedPath,
156 })
157 }
158 } catch {
159 // TODO: log this?
160 }
161
162 return paths
163}
164
165/**
166 * @param {any} context
167 * @param {ContentPath[]} candidateFiles
168 * @param {Map<string, number>} fileModifiedMap
169 * @returns {[{ content: string, extension: string }[], Map<string, number>]}
170 */
171export function resolvedChangedContent(context, candidateFiles, fileModifiedMap) {
172 let changedContent = context.tailwindConfig.content.files
173 .filter((item) => typeof item.raw === 'string')
174 .map(({ raw, extension = 'html' }) => ({ content: raw, extension }))
175
176 let [changedFiles, mTimesToCommit] = resolveChangedFiles(candidateFiles, fileModifiedMap)
177
178 for (let changedFile of changedFiles) {
179 let extension = path.extname(changedFile).slice(1)
180 changedContent.push({ file: changedFile, extension })
181 }
182
183 return [changedContent, mTimesToCommit]
184}
185
186const LARGE_DIRECTORIES = [
187 'node_modules', // Node
188]
189
190// Ensures that `node_modules` has to match as-is, otherwise `mynode_modules`
191// would match as well, but that is not a known large directory.
192const LARGE_DIRECTORIES_REGEX = new RegExp(
193 `(${LARGE_DIRECTORIES.map((dir) => String.raw`\b${dir}\b`).join('|')})`
194)
195
196/**
197 * @param {string[]} paths
198 */
199export function createBroadPatternCheck(paths) {
200 // Detect whether a glob pattern might be too broad. This means that it:
201 // - Includes `**`
202 // - Does not include any of the known large directories (e.g.: node_modules)
203 let maybeBroadPattern = paths.some(
204 (path) => path.includes('**') && !LARGE_DIRECTORIES_REGEX.test(path)
205 )
206
207 // Didn't detect any potentially broad patterns, so we can skip further
208 // checks.
209 if (!maybeBroadPattern) {
210 return () => {}
211 }
212
213 // All glob matchers
214 let matchers = []
215
216 // All glob matchers that explicitly contain any of the known large
217 // directories (e.g.: node_modules).
218 let explicitMatchers = []
219
220 // Create matchers for all paths
221 for (let path of paths) {
222 let matcher = micromatch.matcher(path)
223 if (LARGE_DIRECTORIES_REGEX.test(path)) {
224 explicitMatchers.push(matcher)
225 }
226
227 matchers.push(matcher)
228 }
229
230 // Keep track of whether we already warned about the broad pattern issue or
231 // not. The `log.warn` function already does something similar where we only
232 // output the log once. However, with this we can also skip the other checks
233 // when we already warned about the broad pattern.
234 let warned = false
235
236 /**
237 * @param {string} file
238 */
239 return (file) => {
240 if (warned) return // Already warned about the broad pattern
241 if (explicitMatchers.some((matcher) => matcher(file))) return // Explicitly included, so we can skip further checks
242
243 // When a broad pattern is used, we have to double check that the file was
244 // not explicitly included in the globs.
245 let matchingGlobIndex = matchers.findIndex((matcher) => matcher(file))
246 if (matchingGlobIndex === -1) return // This should never happen
247 let matchingGlob = paths[matchingGlobIndex]
248
249 // Create relative paths to make the output a bit more readable.
250 let relativeMatchingGlob = path.relative(process.cwd(), matchingGlob)
251 if (relativeMatchingGlob[0] !== '.') relativeMatchingGlob = `./${relativeMatchingGlob}`
252
253 let largeDirectory = LARGE_DIRECTORIES.find((directory) => file.includes(directory))
254 if (largeDirectory) {
255 warned = true
256
257 log.warn('broad-content-glob-pattern', [
258 `Your \`content\` configuration includes a pattern which looks like it's accidentally matching all of \`${largeDirectory}\` and can cause serious performance issues.`,
259 `Pattern: \`${relativeMatchingGlob}\``,
260 `See our documentation for recommendations:`,
261 'https://tailwindcss.com/docs/content-configuration#pattern-recommendations',
262 ])
263 }
264 }
265}
266
267/**
268 *
269 * @param {ContentPath[]} candidateFiles
270 * @param {Map<string, number>} fileModifiedMap
271 * @returns {[Set<string>, Map<string, number>]}
272 */
273function resolveChangedFiles(candidateFiles, fileModifiedMap) {
274 let paths = candidateFiles.map((contentPath) => contentPath.pattern)
275 let mTimesToCommit = new Map()
276
277 let checkBroadPattern = createBroadPatternCheck(paths)
278
279 let changedFiles = new Set()
280 env.DEBUG && console.time('Finding changed files')
281 let files = fastGlob.sync(paths, { absolute: true })
282 for (let file of files) {
283 checkBroadPattern(file)
284
285 let prevModified = fileModifiedMap.get(file) || -Infinity
286 let modified = fs.statSync(file).mtimeMs
287
288 if (modified > prevModified) {
289 changedFiles.add(file)
290 mTimesToCommit.set(file, modified)
291 }
292 }
293 env.DEBUG && console.timeEnd('Finding changed files')
294 return [changedFiles, mTimesToCommit]
295}
Note: See TracBrowser for help on using the repository browser.