@jmlweb/vite-config 0.0.0

package/README.md

@@ -0,0 +1,272 @@
+# @jmlweb/vite-config
+
+[![npm version](https://img.shields.io/npm/v/@jmlweb/vite-config)](https://www.npmjs.com/package/@jmlweb/vite-config)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
+[![Node.js](https://img.shields.io/badge/Node.js-%3E%3D18.0.0-339933.svg)](https://nodejs.org/)
+[![Vite](https://img.shields.io/badge/Vite-5.0%2B-646CFF.svg)](https://vite.dev/)
+
+> Base Vite configuration for jmlweb projects. Provides sensible defaults for TypeScript support, build optimization, and development server settings.
+
+## Features
+
+- **Sensible Defaults**: Pre-configured with optimized build and dev server settings
+- **TypeScript Support**: Works seamlessly with TypeScript projects
+- **React Ready**: Optional React integration via plugin injection
+- **Path Aliases**: Easy configuration for module path resolution
+- **Clean API**: Simple functions to create configurations
+- **Fully Typed**: Complete TypeScript support with exported types
+
+## Installation
+
+```bash
+npm install --save-dev @jmlweb/vite-config vite
+```
+
+For React projects, also install the React plugin:
+
+```bash
+npm install --save-dev @vitejs/plugin-react
+```
+
+## Quick Start
+
+Create a `vite.config.ts` file in your project root:
+
+```typescript
+import { createViteConfig } from '@jmlweb/vite-config';
+
+export default createViteConfig();
+```
+
+## Examples
+
+### Basic Setup
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+
+export default createViteConfig();
+```
+
+### With Path Aliases
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+import { resolve } from 'path';
+
+export default createViteConfig({
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, './src'),
+      '@components': resolve(__dirname, './src/components'),
+      '@utils': resolve(__dirname, './src/utils'),
+    },
+  },
+});
+```
+
+### With React Plugin
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+import react from '@vitejs/plugin-react';
+
+export default createViteConfig({
+  plugins: [react()],
+});
+```
+
+### Using the React-Specific Helper
+
+```typescript
+// vite.config.ts
+import { createReactViteConfig } from '@jmlweb/vite-config';
+import react from '@vitejs/plugin-react';
+
+export default createReactViteConfig({
+  reactPlugin: react(),
+  resolve: {
+    alias: {
+      '@': './src',
+    },
+  },
+});
+```
+
+### With Custom Build Settings
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+
+export default createViteConfig({
+  build: {
+    sourcemap: true,
+    target: ['es2020', 'chrome87', 'firefox78', 'safari14'],
+    outDir: 'build',
+  },
+});
+```
+
+### With Custom Server Settings
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+
+export default createViteConfig({
+  server: {
+    port: 3000,
+    open: true,
+    host: true, // Listen on all addresses
+  },
+});
+```
+
+### With Multiple Plugins
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+import react from '@vitejs/plugin-react';
+import svgr from 'vite-plugin-svgr';
+
+export default createViteConfig({
+  plugins: [react(), svgr()],
+  resolve: {
+    alias: {
+      '@': './src',
+    },
+  },
+});
+```
+
+### Full Configuration Example
+
+```typescript
+// vite.config.ts
+import { createViteConfig } from '@jmlweb/vite-config';
+import react from '@vitejs/plugin-react';
+import { resolve } from 'path';
+
+export default createViteConfig({
+  plugins: [
+    react({
+      babel: {
+        plugins: ['@emotion/babel-plugin'],
+      },
+    }),
+  ],
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, './src'),
+    },
+  },
+  build: {
+    sourcemap: true,
+    target: 'es2020',
+  },
+  server: {
+    port: 3000,
+    open: true,
+  },
+  preview: {
+    port: 4000,
+  },
+});
+```
+
+## Configuration Details
+
+### Default Settings
+
+| Category | Setting      | Default Value | Description                     |
+| -------- | ------------ | ------------- | ------------------------------- |
+| Build    | `outDir`     | `'dist'`      | Output directory for production |
+| Build    | `sourcemap`  | `false`       | Source map generation           |
+| Build    | `minify`     | `'esbuild'`   | Minification strategy           |
+| Build    | `target`     | `'esnext'`    | Build target environment        |
+| Server   | `port`       | `5173`        | Development server port         |
+| Server   | `strictPort` | `false`       | Fail if port is in use          |
+| Server   | `open`       | `false`       | Open browser on start           |
+| Server   | `host`       | `'localhost'` | Host to bind to                 |
+| Preview  | `port`       | `4173`        | Preview server port             |
+
+### API Reference
+
+#### `createViteConfig(options?: ViteConfigOptions): UserConfig`
+
+Creates a Vite configuration with sensible defaults.
+
+**Parameters:**
+
+| Option    | Type                      | Description                      |
+| --------- | ------------------------- | -------------------------------- |
+| `plugins` | `Plugin[]`                | Vite plugins to include          |
+| `resolve` | `{ alias?: Record<...> }` | Module resolution configuration  |
+| `build`   | `BuildOptions`            | Build configuration options      |
+| `server`  | `ServerOptions`           | Development server configuration |
+| `preview` | `PreviewOptions`          | Preview server configuration     |
+| `options` | `Partial<UserConfig>`     | Additional Vite options to merge |
+
+**Returns:** A complete Vite `UserConfig` object.
+
+#### `createReactViteConfig(options: ViteConfigOptions & { reactPlugin: Plugin }): UserConfig`
+
+Creates a Vite configuration optimized for React applications.
+
+**Parameters:**
+
+| Option        | Type                | Description                          |
+| ------------- | ------------------- | ------------------------------------ |
+| `reactPlugin` | `Plugin`            | The React plugin instance (required) |
+| ...           | `ViteConfigOptions` | All options from `createViteConfig`  |
+
+**Returns:** A complete Vite `UserConfig` object with React plugin included.
+
+#### `BASE_DEFAULTS`
+
+Exported constant containing the default configuration values for reference.
+
+#### `UserConfig`, `Plugin` (re-exported from Vite)
+
+Vite types are re-exported for convenience when extending configurations.
+
+## When to Use
+
+Use this configuration when you want:
+
+- Consistent Vite configuration across multiple projects
+- Optimized build settings out of the box
+- Easy integration with React and other plugins
+- Type-safe configuration with full TypeScript support
+- A clean, simple API for customization
+
+## Requirements
+
+- **Node.js** >= 18.0.0
+- **Vite** >= 5.0.0
+
+## Peer Dependencies
+
+This package requires the following peer dependency:
+
+- `vite` (>=5.0.0)
+
+Optional peer dependency for React projects:
+
+- `@vitejs/plugin-react` (for React integration)
+
+## Related Packages
+
+- [`@jmlweb/tsconfig-react`](../tsconfig-react) - TypeScript config for React projects
+- [`@jmlweb/eslint-config-react`](../eslint-config-react) - ESLint config for React projects
+- [`@jmlweb/vitest-config`](../vitest-config) - Vitest configuration for testing
+- [`@jmlweb/prettier-config-base`](../prettier-config-base) - Prettier config for consistent formatting
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,89 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  BASE_DEFAULTS: () => BASE_DEFAULTS,
+  createReactViteConfig: () => createReactViteConfig,
+  createViteConfig: () => createViteConfig
+});
+module.exports = __toCommonJS(index_exports);
+var BASE_DEFAULTS = {
+  build: {
+    outDir: "dist",
+    sourcemap: false,
+    minify: "esbuild",
+    target: "esnext",
+    rollupOptions: {
+      output: {
+        manualChunks: void 0
+      }
+    }
+  },
+  server: {
+    port: 5173,
+    strictPort: false,
+    open: false,
+    host: "localhost"
+  },
+  preview: {
+    port: 4173
+  }
+};
+var createViteConfig = (config = {}) => {
+  const {
+    plugins = [],
+    resolve,
+    build = {},
+    server = {},
+    preview = {},
+    options = {}
+  } = config;
+  return {
+    plugins,
+    ...resolve && { resolve },
+    build: {
+      ...BASE_DEFAULTS.build,
+      ...build
+    },
+    server: {
+      ...BASE_DEFAULTS.server,
+      ...server
+    },
+    preview: {
+      ...BASE_DEFAULTS.preview,
+      ...preview
+    },
+    ...options
+  };
+};
+var createReactViteConfig = (config) => {
+  const { reactPlugin, plugins = [], ...rest } = config;
+  return createViteConfig({
+    ...rest,
+    plugins: [reactPlugin, ...plugins]
+  });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BASE_DEFAULTS,
+  createReactViteConfig,
+  createViteConfig
+});

package/dist/index.d.cts

@@ -0,0 +1,207 @@
+import { Plugin, UserConfig } from 'vite';
+export { Plugin, UserConfig } from 'vite';
+
+/**
+ * Options for creating a base Vite configuration
+ */
+interface ViteConfigOptions {
+    /**
+     * Additional Vite plugins to include
+     * @default []
+     */
+    plugins?: Plugin[];
+    /**
+     * Path aliases for module resolution
+     * @example { '@': './src' }
+     */
+    resolve?: {
+        alias?: Record<string, string>;
+    };
+    /**
+     * Build configuration options
+     */
+    build?: {
+        /**
+         * Output directory for production build
+         * @default 'dist'
+         */
+        outDir?: string;
+        /**
+         * Enable/disable source maps
+         * @default false
+         */
+        sourcemap?: boolean | 'inline' | 'hidden';
+        /**
+         * Minification option
+         * @default 'esbuild'
+         */
+        minify?: boolean | 'esbuild' | 'terser';
+        /**
+         * Target environment for build
+         * @default 'esnext'
+         */
+        target?: string | string[];
+    };
+    /**
+     * Development server configuration
+     */
+    server?: {
+        /**
+         * Server port
+         * @default 5173
+         */
+        port?: number;
+        /**
+         * Enable strict port (fail if port is in use)
+         * @default false
+         */
+        strictPort?: boolean;
+        /**
+         * Open browser on server start
+         * @default false
+         */
+        open?: boolean;
+        /**
+         * Host to bind to
+         * @default 'localhost'
+         */
+        host?: string | boolean;
+    };
+    /**
+     * Preview server configuration (for previewing production build)
+     */
+    preview?: {
+        /**
+         * Preview server port
+         * @default 4173
+         */
+        port?: number;
+    };
+    /**
+     * Additional Vite configuration to merge
+     */
+    options?: Omit<UserConfig, 'plugins' | 'resolve' | 'build' | 'server' | 'preview'>;
+}
+/**
+ * Base Vite configuration defaults used across all @jmlweb projects
+ */
+declare const BASE_DEFAULTS: {
+    build: {
+        outDir: string;
+        sourcemap: false;
+        minify: "esbuild";
+        target: string;
+        rollupOptions: {
+            output: {
+                manualChunks: undefined;
+            };
+        };
+    };
+    server: {
+        port: number;
+        strictPort: false;
+        open: false;
+        host: string;
+    };
+    preview: {
+        port: number;
+    };
+};
+/**
+ * Creates a base Vite configuration with sensible defaults
+ *
+ * @example
+ * ```typescript
+ * // Simple usage
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ * export default createViteConfig();
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With path aliases
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ * import { resolve } from 'path';
+ *
+ * export default createViteConfig({
+ *   resolve: {
+ *     alias: {
+ *       '@': resolve(__dirname, './src'),
+ *     },
+ *   },
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With React plugin
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ * import react from '@vitejs/plugin-react';
+ *
+ * export default createViteConfig({
+ *   plugins: [react()],
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With custom build options
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ *
+ * export default createViteConfig({
+ *   build: {
+ *     sourcemap: true,
+ *     target: ['es2020', 'chrome87', 'firefox78', 'safari14'],
+ *   },
+ *   server: {
+ *     port: 3000,
+ *     open: true,
+ *   },
+ * });
+ * ```
+ */
+declare const createViteConfig: (config?: ViteConfigOptions) => UserConfig;
+/**
+ * Creates a Vite configuration optimized for React applications
+ *
+ * This is a convenience function that combines the base configuration
+ * with React-specific settings. You must provide the React plugin.
+ *
+ * @example
+ * ```typescript
+ * import { createReactViteConfig } from '@jmlweb/vite-config';
+ * import react from '@vitejs/plugin-react';
+ *
+ * export default createReactViteConfig({
+ *   reactPlugin: react(),
+ *   resolve: {
+ *     alias: {
+ *       '@': './src',
+ *     },
+ *   },
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With custom React plugin options
+ * import { createReactViteConfig } from '@jmlweb/vite-config';
+ * import react from '@vitejs/plugin-react';
+ *
+ * export default createReactViteConfig({
+ *   reactPlugin: react({
+ *     babel: {
+ *       plugins: ['@emotion/babel-plugin'],
+ *     },
+ *   }),
+ *   build: {
+ *     sourcemap: true,
+ *   },
+ * });
+ * ```
+ */
+declare const createReactViteConfig: (config: ViteConfigOptions & {
+    reactPlugin: Plugin;
+}) => UserConfig;
+
+export { BASE_DEFAULTS, type ViteConfigOptions, createReactViteConfig, createViteConfig };

package/dist/index.d.ts

@@ -0,0 +1,207 @@
+import { Plugin, UserConfig } from 'vite';
+export { Plugin, UserConfig } from 'vite';
+
+/**
+ * Options for creating a base Vite configuration
+ */
+interface ViteConfigOptions {
+    /**
+     * Additional Vite plugins to include
+     * @default []
+     */
+    plugins?: Plugin[];
+    /**
+     * Path aliases for module resolution
+     * @example { '@': './src' }
+     */
+    resolve?: {
+        alias?: Record<string, string>;
+    };
+    /**
+     * Build configuration options
+     */
+    build?: {
+        /**
+         * Output directory for production build
+         * @default 'dist'
+         */
+        outDir?: string;
+        /**
+         * Enable/disable source maps
+         * @default false
+         */
+        sourcemap?: boolean | 'inline' | 'hidden';
+        /**
+         * Minification option
+         * @default 'esbuild'
+         */
+        minify?: boolean | 'esbuild' | 'terser';
+        /**
+         * Target environment for build
+         * @default 'esnext'
+         */
+        target?: string | string[];
+    };
+    /**
+     * Development server configuration
+     */
+    server?: {
+        /**
+         * Server port
+         * @default 5173
+         */
+        port?: number;
+        /**
+         * Enable strict port (fail if port is in use)
+         * @default false
+         */
+        strictPort?: boolean;
+        /**
+         * Open browser on server start
+         * @default false
+         */
+        open?: boolean;
+        /**
+         * Host to bind to
+         * @default 'localhost'
+         */
+        host?: string | boolean;
+    };
+    /**
+     * Preview server configuration (for previewing production build)
+     */
+    preview?: {
+        /**
+         * Preview server port
+         * @default 4173
+         */
+        port?: number;
+    };
+    /**
+     * Additional Vite configuration to merge
+     */
+    options?: Omit<UserConfig, 'plugins' | 'resolve' | 'build' | 'server' | 'preview'>;
+}
+/**
+ * Base Vite configuration defaults used across all @jmlweb projects
+ */
+declare const BASE_DEFAULTS: {
+    build: {
+        outDir: string;
+        sourcemap: false;
+        minify: "esbuild";
+        target: string;
+        rollupOptions: {
+            output: {
+                manualChunks: undefined;
+            };
+        };
+    };
+    server: {
+        port: number;
+        strictPort: false;
+        open: false;
+        host: string;
+    };
+    preview: {
+        port: number;
+    };
+};
+/**
+ * Creates a base Vite configuration with sensible defaults
+ *
+ * @example
+ * ```typescript
+ * // Simple usage
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ * export default createViteConfig();
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With path aliases
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ * import { resolve } from 'path';
+ *
+ * export default createViteConfig({
+ *   resolve: {
+ *     alias: {
+ *       '@': resolve(__dirname, './src'),
+ *     },
+ *   },
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With React plugin
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ * import react from '@vitejs/plugin-react';
+ *
+ * export default createViteConfig({
+ *   plugins: [react()],
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With custom build options
+ * import { createViteConfig } from '@jmlweb/vite-config';
+ *
+ * export default createViteConfig({
+ *   build: {
+ *     sourcemap: true,
+ *     target: ['es2020', 'chrome87', 'firefox78', 'safari14'],
+ *   },
+ *   server: {
+ *     port: 3000,
+ *     open: true,
+ *   },
+ * });
+ * ```
+ */
+declare const createViteConfig: (config?: ViteConfigOptions) => UserConfig;
+/**
+ * Creates a Vite configuration optimized for React applications
+ *
+ * This is a convenience function that combines the base configuration
+ * with React-specific settings. You must provide the React plugin.
+ *
+ * @example
+ * ```typescript
+ * import { createReactViteConfig } from '@jmlweb/vite-config';
+ * import react from '@vitejs/plugin-react';
+ *
+ * export default createReactViteConfig({
+ *   reactPlugin: react(),
+ *   resolve: {
+ *     alias: {
+ *       '@': './src',
+ *     },
+ *   },
+ * });
+ * ```
+ *
+ * @example
+ * ```typescript
+ * // With custom React plugin options
+ * import { createReactViteConfig } from '@jmlweb/vite-config';
+ * import react from '@vitejs/plugin-react';
+ *
+ * export default createReactViteConfig({
+ *   reactPlugin: react({
+ *     babel: {
+ *       plugins: ['@emotion/babel-plugin'],
+ *     },
+ *   }),
+ *   build: {
+ *     sourcemap: true,
+ *   },
+ * });
+ * ```
+ */
+declare const createReactViteConfig: (config: ViteConfigOptions & {
+    reactPlugin: Plugin;
+}) => UserConfig;
+
+export { BASE_DEFAULTS, type ViteConfigOptions, createReactViteConfig, createViteConfig };

package/dist/index.js

@@ -0,0 +1,62 @@
+// src/index.ts
+var BASE_DEFAULTS = {
+  build: {
+    outDir: "dist",
+    sourcemap: false,
+    minify: "esbuild",
+    target: "esnext",
+    rollupOptions: {
+      output: {
+        manualChunks: void 0
+      }
+    }
+  },
+  server: {
+    port: 5173,
+    strictPort: false,
+    open: false,
+    host: "localhost"
+  },
+  preview: {
+    port: 4173
+  }
+};
+var createViteConfig = (config = {}) => {
+  const {
+    plugins = [],
+    resolve,
+    build = {},
+    server = {},
+    preview = {},
+    options = {}
+  } = config;
+  return {
+    plugins,
+    ...resolve && { resolve },
+    build: {
+      ...BASE_DEFAULTS.build,
+      ...build
+    },
+    server: {
+      ...BASE_DEFAULTS.server,
+      ...server
+    },
+    preview: {
+      ...BASE_DEFAULTS.preview,
+      ...preview
+    },
+    ...options
+  };
+};
+var createReactViteConfig = (config) => {
+  const { reactPlugin, plugins = [], ...rest } = config;
+  return createViteConfig({
+    ...rest,
+    plugins: [reactPlugin, ...plugins]
+  });
+};
+export {
+  BASE_DEFAULTS,
+  createReactViteConfig,
+  createViteConfig
+};

package/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "@jmlweb/vite-config",
+  "version": "0.0.0",
+  "description": "Base Vite configuration for jmlweb projects with TypeScript support, build optimization, and optional React integration",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "CHANGELOG.md"
+  ],
+  "keywords": [
+    "build",
+    "bundler",
+    "config",
+    "vite",
+    "vite-config"
+  ],
+  "author": "jmlweb",
+  "license": "MIT",
+  "repository": "jmlweb/tooling.git",
+  "bugs": "https://github.com/jmlweb/tooling/issues",
+  "homepage": "https://github.com/jmlweb/tooling/tree/main/packages/vite-config#readme",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "vite": ">=5.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@vitejs/plugin-react": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "^4.3.4",
+    "tsup": "^8.5.1",
+    "typescript": "^5.9.3",
+    "vite": "^6.0.7",
+    "@jmlweb/tsconfig-internal": "0.0.1"
+  },
+  "scripts": {
+    "build": "tsup",
+    "clean": "rm -rf dist"
+  }
+}