Hi 👋
Vue
📕 发布Vue 3.4 🏀Slam Dunk
- 👉🏻一个2倍快的解析器更
- 👉🏻快的SFC编译
- 👉🏻更准确的反应性系统
- 👉🏻稳定的defineModel（）
- 👉🏻v-bind同名速记
- 👉🏻...
🚀 Vue提示集合
- 👉🏻Michael Thiessen发布了他的Vue Tips Collection电子书的第二版。
- 👉🏻你可以免费获得前两章的30个提示。
Nuxt
📕 Nuxt 3.9已经发布
- 👉🏻Vite 5
- 👉🏻交互式服务器组件
- 👉🏻新的composables
- 👉🏻新的加载API
- 👉🏻...
📕 Nuxt 3中的Web Scraper
- 👉🏻本系列文章包含4个部分，并解释了如何使用Nuxt 3创建Web Scraper。
📕 构建由Nuxt Content提供支持的测验应用程序
- 👉🏻在本教程中，您将学习如何使用Nuxt Content构建测验应用程序。
📕 更安全的Vue& Nuxt应用程序->默认情况下！🛡️
- 👉🏻了解如何使用NuxtSecurity模块使Vue& Nuxt应用在默认情况下更安全。
🛠️ Nuxt OG Image v3发布
- 👉🏻完全重写模块，以提高稳定性和开发人员体验。
🛠️ Nuxt I18n v8.0发布
- 👉🏻经过两年的开发，Nuxt I18n的Nuxt 3稳定版本已经发布。
🛠️ Nuxt API
- 👉🏻使用服务器代理与任何API安全连接。
Nuxt小技巧：处理客户端错误
如果客户端发生错误，Nuxt将显示一个通用错误页面。你通常不想全屏显示错误页面，而是在应用中的特定位置显示错误。因此，Nuxt提供了<NuxtErrorBoundary>组件：
<template>
<NuxtErrorBoundary>
<AnyComponent/>
</NuxtErrorBoundary>
</template>
<NuxtErrorBoundary>将在其默认插槽中捕获所有错误。
您可以使用#error插槽向用户显示错误。它提供了一个clearError函数来清除错误并再次显示子对象：
<script setup lang="ts">
const onError = (error: Error) => {
// Here you can try to resolve the error
}
</script>
<template>
<NuxtErrorBoundary @error="onError">
<AnyComponent/>
<template #error="{ error, clearError }">
An error occurred: {{ error.message }}
<button @click="clearError">
Try again
</button>
</template>
</NuxtErrorBoundary>
</template>
您可以在error = null中调用onError来清除错误。但是这将重新渲染默认插槽。如果您还没有完全解决错误，错误槽将再次出现，这可能导致无限循环。
一个解决方案是在onError中导航到不同的页面：
<script setup lang="ts">
const recoverFromError = async (error) => {
await navigateTo('/');
error.value = null;
}
</script>
如果您导航到另一个页面，错误将自动清除。
这个地址(nuxt.com/docs/examples/advanced/error-handling)演示了如何在不同环境中处理错误的实例：页面，插件，组件和中间件。
😂 轻松一刻
🧑🏻💻其他新闻
📕 学习编写自己的迷你侠盗猎车手游戏与自动驾驶汽车
📕 2023年的Web开发：JavaScript仍然是规则，AI正在崛起
- 👉🏻本文涵盖了2023年的Web发展趋势。
📕 3天内删除5万行代码
- 👉🏻一名开发人员最近删除了超过50，000行代码，占其前端代码库的70%。
- 👉🏻令人惊讶的是，这种大规模的代码删除并没有破坏应用程序，而是导致了显着的简化。
📕 最新的TypeScript配置
- 👉🏻TypeScript配置包含其他选项，可以更可靠地保护您的项目免受类型相关错误的影响，而strict选项尚未自动包含这些错误。
🛠️ Procedural Planets
- 👉🏻一个使用Three.js编写的程序化行星生成器。
🛠️ Svgl
- 👉🏻一个免费使用的SVG徽标库。
🛠️ npminsights
- 👉🏻一个很不错的了解NPM包的程序
看完本文如果觉得有用，记得点个赞支持，收藏起来说不定哪天就用上啦～
专注前端开发，分享前端相关技术干货，公众号：南城大前端（ID: nanchengfe）
