Why tailwind typography not render

<script setup>
import { computed } from "vue"
import { marked } from "marked"
const props = defineProps({
  history: {
    type: Array,
    default: () => [],
    required: true,
  },
})
const histories = computed(() => {
  console.log("History recompute")
  return props.history
})
</script>
<template>
  <div class="w-full h-full max-h-fit flex flex-col gap-2 overflow-auto">
    <div
      class="max-h-fit w-full bg-black flex flex-row"
      alt="container"
      v-for="(history, index) in histories"
      :key="index"
    >
      <div class="avatar p-3 pt-6 max-h-28">
        <div class="w-12 max-h-12 rounded">
          <img
            src="https://media.newyorker.com/photos/59095bb86552fa0be682d9d0/master/pass/Monkey-Selfie.jpg"
            alt=""
          />
        </div>
      </div>
      <div class="p-7 text-justify max-h-fit">
        <div>
          {{ history.request.content }}
        </div>
        <div v-if="history.response.content === ''">
          <span class="loading loading-ring loading-sm"></span>
        </div>
        <div v-else>
          <article class="prose">
            {{ marked.parse(history.response.content) }}
          </article>
        </div>
      </div>
    </div>
  </div>
</template>

<style></style>

I try to use tailwind typography plugin but it not render mark down to tag HTML for me I try to use marked to change markdown to HTML tag before use tailwind typography but it not working please helpme