feat: Complete fleet — 94 skills across 10+ domains
Pulled ALL skills from 15 source repositories: - anthropics/skills: 16 (docs, design, MCP, testing) - obra/superpowers: 14 (TDD, debugging, agents, planning) - coreyhaines31/marketingskills: 25 (marketing, CRO, SEO, growth) - better-auth/skills: 5 (auth patterns) - vercel-labs/agent-skills: 5 (React, design, Vercel) - antfu/skills: 16 (Vue, Vite, Vitest, pnpm, Turborepo) - Plus 13 individual skills from various repos Mosaic Stack is not limited to coding — the Orchestrator and subagents serve coding, business, design, marketing, writing, logistics, analysis, and more. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
162
skills/vite/references/core-config.md
Normal file
162
skills/vite/references/core-config.md
Normal file
@@ -0,0 +1,162 @@
|
||||
---
|
||||
name: vite-config
|
||||
description: Vite configuration patterns using vite.config.ts
|
||||
---
|
||||
|
||||
# Vite Configuration
|
||||
|
||||
## Basic Setup
|
||||
|
||||
```ts
|
||||
// vite.config.ts
|
||||
import { defineConfig } from 'vite'
|
||||
|
||||
export default defineConfig({
|
||||
// config options
|
||||
})
|
||||
```
|
||||
|
||||
Vite auto-resolves `vite.config.ts` from project root. Supports ES modules syntax regardless of `package.json` type.
|
||||
|
||||
## Conditional Config
|
||||
|
||||
Export a function to access command and mode:
|
||||
|
||||
```ts
|
||||
export default defineConfig(({ command, mode, isSsrBuild, isPreview }) => {
|
||||
if (command === 'serve') {
|
||||
return { /* dev config */ }
|
||||
} else {
|
||||
return { /* build config */ }
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
- `command`: `'serve'` during dev, `'build'` for production
|
||||
- `mode`: `'development'` or `'production'` (or custom via `--mode`)
|
||||
|
||||
## Async Config
|
||||
|
||||
```ts
|
||||
export default defineConfig(async ({ command, mode }) => {
|
||||
const data = await fetchSomething()
|
||||
return { /* config */ }
|
||||
})
|
||||
```
|
||||
|
||||
## Using Environment Variables in Config
|
||||
|
||||
`.env` files are loaded **after** config resolution. Use `loadEnv` to access them in config:
|
||||
|
||||
```ts
|
||||
import { defineConfig, loadEnv } from 'vite'
|
||||
|
||||
export default defineConfig(({ mode }) => {
|
||||
// Load env files from cwd, include all vars (empty prefix)
|
||||
const env = loadEnv(mode, process.cwd(), '')
|
||||
|
||||
return {
|
||||
define: {
|
||||
__APP_ENV__: JSON.stringify(env.APP_ENV),
|
||||
},
|
||||
server: {
|
||||
port: env.APP_PORT ? Number(env.APP_PORT) : 5173,
|
||||
},
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
## Key Config Options
|
||||
|
||||
### resolve.alias
|
||||
|
||||
```ts
|
||||
export default defineConfig({
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': '/src',
|
||||
'~': '/src',
|
||||
},
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### define (Global Constants)
|
||||
|
||||
```ts
|
||||
export default defineConfig({
|
||||
define: {
|
||||
__APP_VERSION__: JSON.stringify('1.0.0'),
|
||||
__API_URL__: 'window.__backend_api_url',
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
Values must be JSON-serializable or single identifiers. Non-strings auto-wrapped with `JSON.stringify`.
|
||||
|
||||
### plugins
|
||||
|
||||
```ts
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [vue()],
|
||||
})
|
||||
```
|
||||
|
||||
Plugins array is flattened; falsy values ignored.
|
||||
|
||||
### server.proxy
|
||||
|
||||
```ts
|
||||
export default defineConfig({
|
||||
server: {
|
||||
proxy: {
|
||||
'/api': {
|
||||
target: 'http://localhost:3000',
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(/^\/api/, ''),
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### build.target
|
||||
|
||||
Default: Baseline Widely Available browsers. Customize:
|
||||
|
||||
```ts
|
||||
export default defineConfig({
|
||||
build: {
|
||||
target: 'esnext', // or 'es2020', ['chrome90', 'firefox88']
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
## TypeScript Intellisense
|
||||
|
||||
For plain JS config files:
|
||||
|
||||
```js
|
||||
/** @type {import('vite').UserConfig} */
|
||||
export default {
|
||||
// ...
|
||||
}
|
||||
```
|
||||
|
||||
Or use `satisfies`:
|
||||
|
||||
```ts
|
||||
import type { UserConfig } from 'vite'
|
||||
|
||||
export default {
|
||||
// ...
|
||||
} satisfies UserConfig
|
||||
```
|
||||
|
||||
<!--
|
||||
Source references:
|
||||
- https://vite.dev/config/
|
||||
- https://vite.dev/guide/
|
||||
-->
|
||||
Reference in New Issue
Block a user