V16: Build Backoffice externals with Vite (#19716)

* chore: revamps openid package to organise files in a 'src' folder

* feat: adds all externals as npm workspaces with a vite build

* feat: copies the correct uui assets

* feat: copies the backoffice static assets

* feat: creates the correct module for openid

* feat: copies the correct monaco-editor assets

* feat: moves monaco-editor into its package

* feat: moves dependencies to relevant external modules

* feat: gets rid of rollup

* build: uses tiny-glob instead of glob (one less dependency)

* feat: copies all css assets to dist-cms/css first, minifies them, then copies everything over to StaticAssets

* build: removes old static assets from vite static build

Author: iOvergaard

src/Umbraco.Web.UI.Client/devops/build/copy-to-cms.js

@@ -1,8 +1,24 @@
 import { cpSync, rmSync } from 'fs';
+import { execSync } from 'child_process';
 
 const srcDir = './dist-cms';
 const outputDir = '../Umbraco.Cms.StaticAssets/wwwroot/umbraco/backoffice';
 
+// Copy assets
+console.log('--- Copying assets ---');
+cpSync('./src/assets', `${srcDir}/assets`, { recursive: true });
+console.log('--- Copying assets done ---');
+
+// Copy SRC CSS
+console.log('--- Copying src CSS ---');
+cpSync('./src/css', `${srcDir}/css`, { recursive: true });
+console.log('--- Copying src CSS done ---');
+
+// Minify CSS
+console.log('--- Minifying CSS ---');
+execSync('npx postcss dist-cms/css/**/*.css --replace --use cssnano --verbose', { stdio: 'inherit' });
+console.log('--- Minifying CSS done ---');
+
 rmSync(outputDir, { recursive: true, force: true });
 cpSync(srcDir, outputDir, { recursive: true });
 

src/Umbraco.Web.UI.Client/devops/package/validate-exports.js

@@ -1,4 +1,4 @@
-import { globSync } from 'glob';
+import glob from 'tiny-glob';
 import { packageJsonExports } from './meta.js';
 
 const validateExports = async () => {
@@ -7,7 +7,7 @@ const validateExports = async () => {
 	// Iterate over the exports in package.json
 	for (const [key, value] of Object.entries(packageJsonExports || {})) {
 		if (value) {
-			const jsFiles = await globSync(value);
+			const jsFiles = await glob(value, { filesOnly: true });
 
 			// Log an error if the export from the package.json does not exist in the build output
 			if (jsFiles.length === 0) {