Join the Nuxt Team at Frontend Nation 4-7 June.

nuxt-asciidoc
nuxt-asciidoc

Transformer for using asciidoc in nuxt

nuxt-asciidoc

nuxt-asciidoc-logo

npm versionnpm downloadsLicenseNuxt

If you like asciidoc more than markdown, this plugin is exactly for you.

Features

  • ⛰  It can handle .adoc and there corresponding file extensions and render them.

Known Problems

  • include will not include the content of another file, it will just make a link out of it. You can see it in the screenshot.

Screenshot

nuxt-asciidoc

Quick Setup

  1. Add nuxt-asciidoc dependency to your project
# Using pnpm
pnpm add -D nuxt-asciidoc

# Using yarn
yarn add --dev nuxt-asciidoc

# Using npm
npm install --save-dev nuxt-asciidoc
  1. Add nuxt-asciidoc to the modules section, before the @nuxt/content of nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    'nuxt-asciidoc',
    ...
    '@nuxt/content'
  ]
})

That's it! You can now use My Module in your Nuxt app ✨

Example

view: pages/imprint.vue + corresponding content file: content/imprint.adoc

<script setup>
const { data } = await useAsyncData("imprint", () =>
  queryContent("/imprint").findOne()
);
</script>

<template>
  <main>
    <ContentDoc v-slot="{ doc }">
      <div v-html="doc.body"></div>
    </ContentDoc>
  </main>
</template>

Development (npm, yarn, pnpm)

# 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