Cannot read properties of undefined (reading 'deep')

Environment

---

• Operating System: Darwin
• Node Version: v16.13.0
• Nuxt Version: 3.0.0-27264620.a62351a
• Package Manager: yarn@1.22.17
• Bundler: Vite
• User Config: build
• Runtime Modules: -
• Build Modules: -

---

Describe the bug

Problem <AtomHobButton :kind="'success'" secondary >test a </AtomHobButton> and dont see button

http://localhost:3000/

Reproduction

https://github.com/productdevbook/nuxt3-bug

Additional context

No response

Logs

No response

[danielroe]

The issue seems to be the lack of a corresponding server transform for the v-focus directive. For example, this might work:

import { defineNuxtConfig } from 'nuxt3'

export default defineNuxtConfig({
  vue: {
    compilerOptions: {
      directiveTransforms: {
        focus: () => ({
          props: [],
          needRuntime: true
        })
      }
    }
  }
})

see also https://github.com/nuxt/framework/issues/1695#issuecomment-961065288, https://github.com/vuejs/vitepress/issues/92, https://github.com/vuejs/docs/issues/1261.

[DevIsShortForDevil]

This error also seems to happen when you have a typo in your directives. I accidently used “v-esle” instead of “v-else” and was stuck on this error for a few hours until I found it. it would be really nice if the error could’ve been a little more clear.