Documentation
supastarter for Nuxtsupastarter for Nuxt

Configuration

Learn how to configure your supastarter application.

supastarter is a highly flexible and customizable starter kit and allows you to configure the project to your needs. Configuration is scoped to the app or package that owns the behavior.

This section will cover all configuration options and when to use them.

Config files

Each app and package has its own configuration file.

Marketing app configuration

The marketing app configuration lives in apps/marketing/nuxt.config.ts. It contains settings for public-site behavior such as links, themes, analytics wiring, and marketing-specific options.

SaaS app configuration

The SaaS app configuration lives in apps/saas/nuxt.config.ts. It contains settings for product-app behavior such as redirects, navigation, layouts, and other protected-app concerns.

Within each app, you can access the runtime config through useRuntimeConfig().

Internationalization

Internationalization is scoped by surface. Messages are split into marketing, saas, mail, and shared.

Supported locales are:

  • en
  • de
  • es
  • fr

The i18n configuration is defined in packages/i18n/config.ts.

Auth

Auth flows are served by the SaaS app and use routes like /login, /signup, /forgot-password, /reset-password, and /verify.

The auth configuration lives in packages/auth/config.ts and includes feature flags for signup, magic links, social login, passkeys, 2FA, and organizations.

The minimum password length is 8.

If you configure reserved organization slugs, include all system routes used by the app, including chatbot.

Mail

Mail configuration lives in the mail package. Mail helpers live under packages/mail/lib, and mail translations use the scoped i18n setup.

Payments

export const config = {
	billingAttachedTo: "user" as "user" | "organization",
	requireActiveSubscription: false,
	plans: {
		free: {
			isFree: true,
		},
		pro: {
			recommended: true,
			prices: [
				{
					type: "recurring",
					priceId: process.env
						.PRICE_ID_PRO_MONTHLY as string,
					interval: "month",
					amount: 29,
					currency: "USD",
					seatBased: true,
					trialPeriodDays: 7,
				},
				{
					type: "recurring",
					priceId: process.env
						.PRICE_ID_PRO_YEARLY as string,
					interval: "year",
					amount: 290,
					currency: "USD",
					seatBased: true,
					trialPeriodDays: 7,
				},
			],
		},
		lifetime: {
			prices: [
				{
					type: "one-time",
					priceId: process.env
						.PRICE_ID_LIFETIME as string,
					amount: 799,
					currency: "USD",
				},
			],
		},
		enterprise: {
			isEnterprise: true,
		},
	},
} as const;

Billing is plan-driven. Checkout creation works with planId, type, and optional interval, and the provider price is resolved server-side.

Storage

export const config = {
	bucketNames: {
		avatars: process.env.NEXT_PUBLIC_AVATARS_BUCKET_NAME ?? "avatars",
	},
} as const;

Use cases

The configuration options enable you to set up lots of different use cases. Here are some examples:

Marketing site

The public site is implemented in apps/marketing. This app owns its own routes, layout, configuration, and content collections.

SaaS application

The protected product app is implemented in apps/saas. This app owns auth, onboarding, organizations, settings, billing, admin pages, and API routes.