LunarCSS

lunar-css init

Auto-detect your project type and configure everything in one command.

Usage

npx lunar-css init           # detect + configure
npx lunar-css init --dry-run # preview without writing
npx lunar-css --version
npx lunar-css --help

Project detection

The CLI reads package.json in the current directory and chooses a runner:

ConditionRunner
dependencies.expo presentExpo
dependencies.next presentNext.js
dependencies.react-native present (no expo, no next)RN Bare
None of the aboveError — exits

Expo wins when both expo and react-native are present.

Expo SDK warning: if expo version is < 50, the CLI prints a warning recommending an upgrade. LunarCSS works best with SDK 50+.

What each runner generates

Expo

lunar.config.ts        created — token source of truth
metro.config.js        created or AST-merged
.gitignore             updated — .lunarcss/ ignored
tsconfig.json          updated — types: ["@lunar-kit/css/types"]

Default metro.config.js:

const { getDefaultConfig } = require('expo/metro-config')
const { withLunarCSS } = require('@lunar-kit/css/metro')

const config = getDefaultConfig(__dirname)
module.exports = withLunarCSS(config)

Next.js

lunar.config.ts        created
app/globals.css        created or patched
.gitignore             updated
tsconfig.json          updated

app/globals.css (created or block prepended):

/* LunarCSS */
@import "tailwindcss";
@plugin "@lunar-kit/css";

The CLI searches 8 candidate paths for an existing globals CSS file before creating a new one.

RN Bare

Same as Expo but uses @react-native/metro-config + mergeConfig:

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config')
const { withLunarCSS } = require('@lunar-kit/css/metro')

const config = {}
module.exports = withLunarCSS(mergeConfig(getDefaultConfig(__dirname), config))

Default lunar.config.ts

All runners generate the same starter config:

import { defineConfig } from '@lunar-kit/css'

export default defineConfig({
  theme: {
    extend: {
      colors: {
        primary: 'oklch(0.6 0.2 264)',
        accent: '#f59e0b',
      },
      spacing: {
        xs: '4px',
        card: '24px',
      },
      borderRadius: {
        card: '14px',
      },
    },
  },
})

--dry-run

Preview what the CLI would write without touching any files:

npx lunar-css init --dry-run

Output shows each file with its planned action:

[+] lunar.config.ts       (would create)
[~] metro.config.js       (would merge)
[=] .gitignore            (already up to date)
[~] tsconfig.json         (would update)

On this page