Nuxt生产环境与Apache配合时createError函数异常问题求助

正在学习Nuxt框架，正如瑞典谚语所说，学习过程有苦有甜。目前碰到生产构建后的错误处理问题：开发环境下一切正常，但生产环境中使用createError函数处理错误时出现异常，怀疑和Apache的.htaccess配置有关。

根目录下的基础错误处理文件error.vue可正常触发，比如访问http://nuxtshop.localhost/xyz/zyz时能正常显示错误页面。但当产品不存在（URL参数无效）时，页面会重定向到首页并显示空白——仅加载default.vue布局，插槽内容未填充。

当前.htaccess配置 #

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>

产品页面相关代码 #

Script部分： #

<script setup>
 const { id } = useRoute().params;
 const runtimeConfig = useRuntimeConfig()
 const uri =`${runtimeConfig.public.apiUrl}/api/content/item/Products/${id}`
 const { data: product } = await useFetch(uri, {
 method: "GET",
 key: id,
 })
 if (!product.value) {
 throw createError({ statusCode: 404, statusMessage: "Procuct not found (shop id)" })
 }
</script>

补充：猜测该问题和Nuxt官方Issue #15432为同一问题。

内容的提问来源于stack exchange，提问作者Klas