<DevOnly>
Рендеринг компонентов только во время разработки с помощью компонента DevOnly.
Nuxt предоставляет компонент DevOnly для рендеринга компонента только во время разработки.
Содержимое не будет включено в продакшен сборки.
pages/example.vue
<template>
<div>
<Sidebar />
<DevOnly>
<!-- этот компонент будет отображаться только во время разработки -->
<LazyDebugBar />
<!-- если вам когда-нибудь понадобится замена в продакшене -->
<!-- обязательно протестируйте их с помощью `nuxt preview` -->.
<template #fallback>
<div><!-- пустой div для flex.justify-between --></div>
</template>
</DevOnly>
</div>
</template>
Слоты
#fallback: если вам когда-нибудь потребуется замена во время продакшен сборки.
<template>
<div>
<Sidebar />
<DevOnly>
<!-- этот компонент будет отображаться только во время разработки -->
<LazyDebugBar />
<!-- обязательно протестируйте их с помощью `nuxt preview` -->.
<template #fallback>
<div><!-- пустой div для flex.justify-between --></div>
</template>
</DevOnly>
</div>
</template>