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>
2.8 KiB
2.8 KiB
name, description
| name | description |
|---|---|
| vite-config | Vite configuration patterns using vite.config.ts |
Vite Configuration
Basic Setup
// 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:
export default defineConfig(({ command, mode, isSsrBuild, isPreview }) => {
if (command === 'serve') {
return { /* dev config */ }
} else {
return { /* build config */ }
}
})
command:'serve'during dev,'build'for productionmode:'development'or'production'(or custom via--mode)
Async Config
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:
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
export default defineConfig({
resolve: {
alias: {
'@': '/src',
'~': '/src',
},
},
})
define (Global Constants)
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
import vue from '@vitejs/plugin-vue'
export default defineConfig({
plugins: [vue()],
})
Plugins array is flattened; falsy values ignored.
server.proxy
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:
export default defineConfig({
build: {
target: 'esnext', // or 'es2020', ['chrome90', 'firefox88']
},
})
TypeScript Intellisense
For plain JS config files:
/** @type {import('vite').UserConfig} */
export default {
// ...
}
Or use satisfies:
import type { UserConfig } from 'vite'
export default {
// ...
} satisfies UserConfig