Inline the css-variables-parser dependency (#29571)
		
	Get rid of the `postcss@7` dependency by inlining this simple function. (cherry picked from commit d769b664dedb5f63b73146b58b21c0a772c2630d)
This commit is contained in:
		
					parent
					
						
							
								2e9ca0597d
							
						
					
				
			
			
				commit
				
					
						eadf1d4fa3
					
				
			
		
					 3 changed files with 24 additions and 41 deletions
				
			
		
							
								
								
									
										30
									
								
								package-lock.json
									
										
									
										generated
									
									
									
								
							
							
						
						
									
										30
									
								
								package-lock.json
									
										
									
										generated
									
									
									
								
							|  | @ -24,7 +24,6 @@ | |||
|         "chartjs-plugin-zoom": "2.0.1", | ||||
|         "clippie": "4.0.7", | ||||
|         "css-loader": "6.10.0", | ||||
|         "css-variables-parser": "1.0.1", | ||||
|         "dayjs": "1.11.10", | ||||
|         "dropzone": "6.0.0-beta.2", | ||||
|         "easymde": "2.18.0", | ||||
|  | @ -4032,35 +4031,6 @@ | |||
|         "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/css-variables-parser": { | ||||
|       "version": "1.0.1", | ||||
|       "resolved": "https://registry.npmjs.org/css-variables-parser/-/css-variables-parser-1.0.1.tgz", | ||||
|       "integrity": "sha512-GWaqrwGtAWVr/yjjE17iyvbcy+W3voe0vko1/xLCwFeYd3kTLstzUdVH+g5TTXejrtlsb1FS4L9rP6PmeTa8wQ==", | ||||
|       "dependencies": { | ||||
|         "postcss": "^7.0.36" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/css-variables-parser/node_modules/picocolors": { | ||||
|       "version": "0.2.1", | ||||
|       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz", | ||||
|       "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==" | ||||
|     }, | ||||
|     "node_modules/css-variables-parser/node_modules/postcss": { | ||||
|       "version": "7.0.39", | ||||
|       "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz", | ||||
|       "integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==", | ||||
|       "dependencies": { | ||||
|         "picocolors": "^0.2.1", | ||||
|         "source-map": "^0.6.1" | ||||
|       }, | ||||
|       "engines": { | ||||
|         "node": ">=6.0.0" | ||||
|       }, | ||||
|       "funding": { | ||||
|         "type": "opencollective", | ||||
|         "url": "https://opencollective.com/postcss/" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/css-what": { | ||||
|       "version": "6.1.0", | ||||
|       "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz", | ||||
|  |  | |||
|  | @ -23,7 +23,6 @@ | |||
|     "chartjs-plugin-zoom": "2.0.1", | ||||
|     "clippie": "4.0.7", | ||||
|     "css-loader": "6.10.0", | ||||
|     "css-variables-parser": "1.0.1", | ||||
|     "dayjs": "1.11.10", | ||||
|     "dropzone": "6.0.0-beta.2", | ||||
|     "easymde": "2.18.0", | ||||
|  |  | |||
|  | @ -1,9 +1,28 @@ | |||
| import {readFileSync} from 'node:fs'; | ||||
| import {env} from 'node:process'; | ||||
| import {parse} from 'css-variables-parser'; | ||||
| import {parse} from 'postcss'; | ||||
| 
 | ||||
| const isProduction = env.NODE_ENV !== 'development'; | ||||
| 
 | ||||
| function extractRootVars(css) { | ||||
|   const root = parse(css); | ||||
|   const vars = new Set(); | ||||
|   root.walkRules((rule) => { | ||||
|     if (rule.selector !== ':root') return; | ||||
|     rule.each((decl) => { | ||||
|       if (decl.value && decl.prop.startsWith('--')) { | ||||
|         vars.add(decl.prop.substring(2)); | ||||
|       } | ||||
|     }); | ||||
|   }); | ||||
|   return Array.from(vars); | ||||
| } | ||||
| 
 | ||||
| const vars = extractRootVars([ | ||||
|   readFileSync(new URL('web_src/css/themes/theme-gitea-light.css', import.meta.url), 'utf8'), | ||||
|   readFileSync(new URL('web_src/css/themes/theme-gitea-dark.css', import.meta.url), 'utf8'), | ||||
| ].join('\n')); | ||||
| 
 | ||||
| export default { | ||||
|   prefix: 'tw-', | ||||
|   important: true, // the frameworks are mixed together, so tailwind needs to override other framework's styles
 | ||||
|  | @ -23,15 +42,10 @@ export default { | |||
|   theme: { | ||||
|     colors: { | ||||
|       // make `tw-bg-red` etc work with our CSS variables
 | ||||
|       ...Object.fromEntries( | ||||
|         Object.keys(parse([ | ||||
|           readFileSync(new URL('web_src/css/themes/theme-gitea-light.css', import.meta.url), 'utf8'), | ||||
|           readFileSync(new URL('web_src/css/themes/theme-gitea-dark.css', import.meta.url), 'utf8'), | ||||
|         ].join('\n'), {})).filter((prop) => prop.startsWith('color-')).map((prop) => { | ||||
|           const color = prop.substring(6); | ||||
|           return [color, `var(--color-${color})`]; | ||||
|         }) | ||||
|       ), | ||||
|       ...Object.fromEntries(vars.filter((prop) => prop.startsWith('color-')).map((prop) => { | ||||
|         const color = prop.substring(6); | ||||
|         return [color, `var(--color-${color})`]; | ||||
|       })), | ||||
|       inherit: 'inherit', | ||||
|       current: 'currentcolor', | ||||
|       transparent: 'transparent', | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue
	
	 silverwind
				silverwind