Nuxt.js

Preview.js supports both Nuxt 2 and Nuxt 3. See instructions for Vue for general Vue configuration.

If you use Nuxt 3 with auto-imports, you may find that Preview.js isn't able to handle them correctly.

You can remediate this by installing unimport in your project and setting up a Vite configuration:

// vite.config.ts

import Unimport from "unimport/unplugin";

export default {
  plugins: [
    Unimport.vite({
      include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/],
      presets: ["vue"],
      addons: {
        vueTemplate: true,
      },
    }),
  ],
};

You can test this configuration with the following component:

<script setup>
  /* ref() and computed() are auto-imported */
  const count = ref(1);
  const double = computed(() => count.value * 2);
</script>
<template>
  <div>{{ double }}</div>
</template>

Note that Nuxt-specific components such as NuxtWelcome cannot be auto-imported by Preview.js.