nuxt / bridge

🌉 Experience Nuxt 3 features on existing Nuxt 2 projects
MIT License
272 stars 30 forks source link

"export 'defineNuxtMiddleware' was not found in '#app' #233

Closed chz closed 3 years ago

chz commented 3 years ago

Environment

- Operating System: `Darwin`
- Node Version:     `v14.18.0`
- Nuxt Version:     `2.16.0-27226092.034b9901`
- Package Manager:  `Yarn`
- Bundler:          `Webpack`
- User Config:      `head`, `loading`, `css`, `plugins`, `modules`, `privateRuntimeConfig`, `publicRuntimeConfig`, `pwa`, `storage`, `axios`, `manifest`, `robots`, `auth`, `router`, `buildModules`, `optimizedImages`, `build`
- Runtime Modules:  `portal-vue/nuxt`, `@nuxtjs/robots@2.5.0`, `@nuxtjs/pwa@3.3.5`, `@nuxtjs/axios@5.13.6`, `@nuxtjs/auth@4.9.1`, `@nuxtjs/universal-storage@0.5.9`, `nuxt-i18n@6.28.1`, `vue-currency-filter/nuxt`
- Build Modules:    `@aceforth/nuxt-optimized-images@1.4.0`, `@nuxt/bridge@3.0.0-27242696.dbbce5f`

Describe the bug

Object(...) is not a function
  at Module../middleware/authenticated.js (./.nuxt/dist/server/server.js:21065:129)
  at __webpack_require__ (./.nuxt/dist/server/server.js:27:30)
  at Module../.nuxt/middleware.js (./.nuxt/dist/server/server.js:2494:31)
  at __webpack_require__ (./.nuxt/dist/server/server.js:27:30)
  at Module../.nuxt/server.js (./.nuxt/dist/server/server.js:6385:72)
  at __webpack_require__ (./.nuxt/dist/server/server.js:27:30)
  at Object.0 (./.nuxt/dist/server/server.js:83648:18)
  at __webpack_require__ (./.nuxt/dist/server/server.js:27:30)
  at ./.nuxt/dist/server/server.js:133:18
  at Object.<anonymous> (./.nuxt/dist/server/server.js:136:10)

Reproduction

Just create middleware or use any middleware and refactor to new syntax ex.:

import { defineNuxtMiddleware } from '#app'
export default defineNuxtMiddleware(({ app, store, redirect }) => {
  if (store.state.auth.loggedIn) {
    return redirect(app.localePath('account-id-card'))
  }
})

If i will import like this it will be work:

import { defineNuxtMiddleware } from '@nuxt/bridge/dist/runtime/capi.legacy'
export default defineNuxtMiddleware(({ app, store, redirect }) => {
  if (store.state.auth.loggedIn) {
    return redirect(app.localePath('account-id-card'))
  }
})

But there is another warn: [bridge] [legacy capi]@nuxtjs/composition-apiis deprecated. Please see https://v3.nuxtjs.org for more information.

Additional context

No response

Logs

No response

pi0 commented 3 years ago

You can just remove defineNuxtMiddleware type helper. Nuxt 3 does not support middleware like nuxt 2 (at least at the moment) and #app is a nuxt3 compatible interface.

export default ({ app, store, redirect }) => {
  if (store.state.auth.loggedIn) {
    return redirect(app.localePath('account-id-card'))
  }
}

For type support:

import type { Middleware } from '@nuxt/types'

export default <Middleware> function ({ app, store, redirect }) {
}

BTW We needed better messages and docs sorry for inconviences. Tracking in nuxt/bridge#209