Simple CMS module for Nuxt

This module is my personal, minimalist, opinionated, independent alternative to @nuxt/content and studio which are currently still instable and too heavy for my use cases.

• ✨  Release Notes

Features

• Simple Admin UI to manage content files
• Composables to use the content in your Nuxt app
• sendMail utility to send emails via SMTP
• MDC support

What this is not

• Git-based
• horizontally scalable
• meant to be used once @nuxt/content and studio are stable

Setup

npx nuxi module add mktcms

NUXT_PUBLIC_MKTCMS_SITE_URL="http://localhost:3000"
NUXT_MKTCMS_ADMIN_AUTH_KEY="your-admin-auth-key"
NUXT_MKTCMS_SMTP_HOST="your-smtp-host"
NUXT_MKTCMS_SMTP_PORT=465
NUXT_MKTCMS_SMTP_SECURE=true
NUXT_MKTCMS_SMTP_USER="your-smtp-user"
NUXT_MKTCMS_SMTP_PASS="your-smtp-pass"
NUXT_MKTCMS_MAILER_FROM="your-mailer-from-address"
NUXT_MKTCMS_MAILER_TO="your-mailer-to-address"

Add storage directory to .gitignore:

.storage

Usage

.storage/
  Home.md
  Articles/
    Article 1.md
    Article 2.md

<!-- Home.md -->
---
title: Home
---
Welcome to **MKT CMS**!

::alert
Your alert component.
::

<script setup lang="ts">
const home = await useMdContent<{ title: string }>('Home.md')
const articles = await useMdContents('Articles')
</script>

<template>
  <h1>{{ home.title }}</h1>
  <MDC :value="home.markdown" />
  <article v-for="article in articles" :key="article.key">
    <MDC :value="article.markdown" />
  </article>
</template>

Mailer

await sendMail({
  subject: 'Notification from MKT CMS',
  fields: {
    Name: 'Jane Smith',
    Message: 'Hello, this is a test message.',
  },
  replyTo: '[email protected]',
})

Contribution

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release