Moodji Documentation
Home
Download App
  • 简体中文
  • English
  • 日本語
  • 한국어
Home
Download App
  • 简体中文
  • English
  • 日本語
  • 한국어
  • Hi, I'm Moodji

    • Your Watch Companion That Understands You
    • 🚀 Getting Started
  • Value Propositions

    • 🎯 What Problems Does Moodji Aim to Solve?
    • Automatic Logging
    • Gentle Awareness
    • Sustainable Actions
  • User Handbook

    • 🧱 Status Blocks & Activity Status
    • ⌚️ Watch App & Watch Face
    • 📊 Status Records, Weekly Reports, Trends
    • 😺 Emoji Stickers & Monthly Events
    • ☀️ Daily Habits & Streaks
    • 🍃 Leaves, Donations, Community
    • ❓ FAQs
  • Into Daily Habits

    • The Essence Behind Daily Habits
    • 💤 Sleep Tight
    • 💪 Moderate Exercise
    • 👟 Go for a Walk
    • 🧹 Occasionally Busy
    • 🧘🏻 Focus on the Present
    • 😮‍💨 Manage Stress
  • Further Reading

    • Why Keep Track of Daily Life?
    • Gentle Self-Discipline Is More Sustainable
    • What Exactly Is a Habit?
    • The Sleep Science You Need to Know
    • Understanding Health Data
  • Service Agreement

    • Terms of Use
    • Privacy Policy

Configuration

Config File

The essential file for configuring a VuePress site is .vuepress/config.js, while TypeScript config file is also supported. You can use .vuepress/config.ts instead to get better types hint for VuePress config.

To be more specific, we have a convention for config file paths (in order of precedence):

  • In current working directory cwd:
    • vuepress.config.ts
    • vuepress.config.js
    • vuepress.config.mjs
  • In source directory sourceDir:
    • .vuepress/config.ts
    • .vuepress/config.js
    • .vuepress/config.mjs

You can also specify the config file via --config option of CLI:

vuepress dev docs --config my-config.ts

A basic config file looks like this:

import { viteBundler } from '@vuepress/bundler-vite'
import { defaultTheme } from '@vuepress/theme-default'
import { defineUserConfig } from 'vuepress'

export default defineUserConfig({
  bundler: viteBundler(),
  theme: defaultTheme(),

  lang: 'en-US',
  title: 'Hello VuePress',
  description: 'Just playing around',
})

TIP

Check out the Config Reference for a full list of VuePress config.

Client Config File

In most cases, the config file is sufficient to configure your VuePress site. However, sometimes users may want to add some client-side code directly. To help with this, VuePress also supports a client config file:

├─ docs
│  ├─ .vuepress
│  │  ├─ client.js   <--- client config file
│  │  └─ config.js   <--- config file
│  └─ README.md
├─ .gitignore
└─ package.json

Similarly, we also have a convention for client config file paths (in order of precedence):

  • In current working directory cwd:
    • vuepress.client.ts
    • vuepress.client.js
    • vuepress.client.mjs
  • In source directory sourceDir:
    • .vuepress/client.ts
    • .vuepress/client.js
    • .vuepress/client.mjs

A basic client config file looks like this:

import { defineClientConfig } from 'vuepress/client'

export default defineClientConfig({
  enhance({ app, router, siteData }) {},
  setup() {},
  rootComponents: [],
})

TIP

Unlike config file, client config file could not be specified via CLI options.

To learn more about client config file, see Advanced > Cookbook > Usage of Client Config