#2216·redoc

Redoc using CDN in Vue Template raises `require is not defined` error

Author: moluwoleCreated Nov 28, 2022Updated Sep 15, 2026
LabelsType: Bug

Describe the bug Hello guys, Awesome work on this. Really cool tool to use....

As there is no support for VueJS, I tried adding the CDN to the index.html of my project but I was not able to make use of the redoc object in my Vue Components. In order to resolve this, I used a workaround by injecting the CDN url into my component directly which works but I got this error when using the 2.0 CDN

Uncaught ReferenceError: require is not defined

Here is my Code

javascript
<template>
  <div id="redoc-container">
    <redoc spec-url="../src/assets/docs/spec.yaml"></redoc>
  </div>
</template>

<script setup lang="ts">
import { onMounted } from "vue";

onMounted(() => {
  const redocScript = document.createElement("script");
  redocScript.setAttribute(
    "src",
    "https://cdn.redoc.ly/redoc/latest/bundles/redoc.standalone.js"
  );

  document.head.appendChild(redocScript);
});
</script>

Expected behavior It should load the Spec file correctly

Minimal reproducible OpenAPI snippet(if possible)

Screenshots If applicable, add screenshots to help explain your problem.

Additional context Add any other context about the problem here.