Merge pull request #234 from metonym/optimize-frontend-carbon

Use `carbon-preprocess-svelte` for faster, optimized builds

Author: Luke-Roy-IBM

fotobox/frontend-app/package-lock.json

@@ -13,6 +13,7 @@
 		"@sveltejs/kit": "^2.0.0",
 		"@sveltejs/vite-plugin-svelte": "^3.0.0",
 		"carbon-components-svelte": "^0.85.2",
+		"carbon-preprocess-svelte": "^0.11.11",
 		"svelte": "^4.2.7",
 		"vite": "^5.0.3"
 	},

fotobox/frontend-app/package.json

@@ -1,7 +1,12 @@
 import adapter from '@sveltejs/adapter-node';
+import { optimizeImports } from 'carbon-preprocess-svelte';
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
+	preprocess: [
+		// Optimize Carbon imports for faster development and build times.
+		optimizeImports()
+	],
 	kit: {
 		// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
 		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.

fotobox/frontend-app/svelte.config.js

@@ -1,6 +1,12 @@
 import { sveltekit } from '@sveltejs/kit/vite';
 import { defineConfig } from 'vite';
+import { optimizeCss } from 'carbon-preprocess-svelte';
 
 export default defineConfig({
-	plugins: [sveltekit()]
+	plugins: [
+		sveltekit(),
+
+		// Optimize CSS from `carbon-components-svelte` when building for production.
+		optimizeCss()
+	]
 });