refactor: merge vite configs

package.json

@@ -43,9 +43,9 @@
 		"dev": "vite",
 		"start": "vite",
 		"build": "tsc -b && vite build && npm run build:lib && npm run build:umd",
-		"build:lib": "vite build --config vite.lib.config.js",
+		"build:lib": "MODE=lib vite build",
-		"build:lib:watch": "vite build --config vite.lib.config.js --watch",
+		"build:lib:watch": "MODE=lib vite build --watch",
-		"build:umd": "vite build --config vite.umd.config.js",
+		"build:umd": "MODE=umd vite build",
 		"lint": "eslint .",
 		"prepare": "husky"
 	},

vite.config.js

@@ -1,17 +1,25 @@
 // @ts-check
+// ============================================================================
+// Export Configuration Based on MODE Environment Variable
+// ============================================================================
 import tailwindcss from '@tailwindcss/vite'
 import react from '@vitejs/plugin-react-swc'
+import chalk from 'chalk'
 import 'dotenv/config'
 import process from 'node:process'
 import { dirname, resolve } from 'path'
+import dts from 'unplugin-dts/vite'
 import { fileURLToPath } from 'url'
 import { defineConfig } from 'vite'
+import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js'
 
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = dirname(__filename)
 
+// Website Config (React Documentation Site)
+
 /** @type {import('vite').UserConfig} */
-const config = {
+const websiteConfig = {
 	// https://vite.dev/config/
 	base: './',
 	plugins: [react(), tailwindcss()],
@@ -28,4 +36,92 @@ const config = {
 	},
 }
 
+// ============================================================================
+// Library Config (ES Module for NPM Package)
+// ============================================================================
+/** @type {import('vite').UserConfig} */
+const libConfig = {
+	// Library build configuration
+	plugins: [
+		dts({ tsconfigPath: './tsconfig.json', bundleTypes: true }),
+		cssInjectedByJsPlugin({ relativeCSSInjection: true }),
+	],
+	resolve: {
+		alias: {
+			'@': resolve(__dirname, 'src'),
+		},
+	},
+	publicDir: false,
+	esbuild: {
+		keepNames: true,
+	},
+	build: {
+		lib: {
+			entry: resolve(__dirname, 'src/PageAgent.ts'),
+			name: 'PageAgent',
+			fileName: 'page-agent',
+			formats: ['es'],
+		},
+		outDir: resolve(__dirname, 'dist', 'lib'),
+		rollupOptions: {
+			external: ['@ai-sdk/openai', 'ai', 'ai-motion', 'chalk', 'zod'],
+		},
+		// minify: 'terser',
+		minify: false,
+		sourcemap: true,
+		cssCodeSplit: true,
+	},
+	define: {
+		'process.env.NODE_ENV': '"production"',
+	},
+}
+
+// ============================================================================
+// UMD Config (Browser Bundle for CDN)
+// ============================================================================
+/** @type {import('vite').UserConfig} */
+const umdConfig = {
+	// Library build configuration
+	plugins: [cssInjectedByJsPlugin({ relativeCSSInjection: true })],
+	resolve: {
+		alias: {
+			'@': resolve(__dirname, 'src'),
+		},
+	},
+	publicDir: false,
+	esbuild: {
+		keepNames: true,
+	},
+	build: {
+		lib: {
+			entry: resolve(__dirname, 'src/entry.ts'),
+			name: 'PageAgent',
+			fileName: 'page-agent',
+			formats: ['umd'],
+		},
+		outDir: resolve(__dirname, 'dist', 'umd'),
+		cssCodeSplit: true,
+	},
+	define: {
+		'process.env.NODE_ENV': '"production"',
+	},
+}
+
+// ============================================================================
+
+// ============================================================================
+
+const MODE = process.env.MODE
+
+console.log(chalk.cyan(`📦 Build mode: ${chalk.bold(MODE || 'website')}`))
+
+let config
+if (MODE === 'lib') {
+	config = libConfig
+} else if (MODE === 'umd') {
+	config = umdConfig
+} else {
+	config = websiteConfig
+}
+
 export default defineConfig(config)

vite.lib.config.js

@@ -1,48 +0,0 @@
-// @ts-check
-import { dirname, resolve } from 'path'
-import dts from 'unplugin-dts/vite'
-import { fileURLToPath } from 'url'
-import { defineConfig } from 'vite'
-import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
-/** @type {import('vite').UserConfig} */
-const config = {
-	// Library build configuration
-	plugins: [
-		dts({ tsconfigPath: './tsconfig.json', bundleTypes: true }),
-		cssInjectedByJsPlugin({ relativeCSSInjection: true }),
-	],
-	resolve: {
-		alias: {
-			'@': resolve(__dirname, 'src'),
-		},
-	},
-	publicDir: false,
-	esbuild: {
-		keepNames: true,
-	},
-	build: {
-		lib: {
-			entry: resolve(__dirname, 'src/PageAgent.ts'),
-			name: 'PageAgent',
-			fileName: 'page-agent',
-			formats: ['es'],
-		},
-		outDir: resolve(__dirname, 'dist', 'lib'),
-		rollupOptions: {
-			external: ['@ai-sdk/openai', 'ai', 'ai-motion', 'chalk', 'zod'],
-		},
-		// minify: 'terser',
-		minify: false,
-		sourcemap: true,
-		cssCodeSplit: true,
-	},
-	define: {
-		'process.env.NODE_ENV': '"production"',
-	},
-}
-
-export default defineConfig(config)

vite.umd.config.js

@@ -1,38 +0,0 @@
-// @ts-check
-import { dirname, resolve } from 'path'
-import { fileURLToPath } from 'url'
-import { defineConfig } from 'vite'
-import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
-/** @type {import('vite').UserConfig} */
-const config = {
-	// Library build configuration
-	plugins: [cssInjectedByJsPlugin({ relativeCSSInjection: true })],
-	resolve: {
-		alias: {
-			'@': resolve(__dirname, 'src'),
-		},
-	},
-	publicDir: false,
-	esbuild: {
-		keepNames: true,
-	},
-	build: {
-		lib: {
-			entry: resolve(__dirname, 'src/entry.ts'),
-			name: 'PageAgent',
-			fileName: 'page-agent',
-			formats: ['umd'],
-		},
-		outDir: resolve(__dirname, 'dist', 'umd'),
-		cssCodeSplit: true,
-	},
-	define: {
-		'process.env.NODE_ENV': '"production"',
-	},
-}
-
-export default defineConfig(config)