nuxt-directus
nuxt-directus copied to clipboard
[Vue Router warn]: No match found for location with path <API URL>
Vue Router warn appears every time I use any of the functions from the nuxt-directus composables.
Version
nuxt-directus: 5.6.1 nuxt: 3.11.2
Steps to reproduce
nuxt.config.ts
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
devtools: { enabled: true },
modules: ['nuxt-directus'],
runtimeConfig: {
directus: {
url: "http://localhost:8055"
}
}
})
pages/index.vue
<template>
<span @click="fetchCollections">test</span>
</template>
<script setup lang='ts'>
const { getCollections } = useDirectusCollections();
const router = useRouter();
const fetchCollections = async () => {
const collections = await getCollections();
};
</script>
What is Expected?
Response from Directus.
What is actually happening?
WARN [Vue Router warn]: No match found for location with path "/collections/"
I'm experiencing the same bug. Items are accessible directly from http://localhost:8055/items/navigation/main-menu but not through nuxt v3.11.2.
const { data: menu } = await useAsyncData("navigation", () =>
getItemById<NavigationMenu>({
collection: "navigation",
id: "main-menu",
})
);
I've setup my runtime configuration correctly.
runtimeConfig: {
directus: {
url: "http://localhost:8055",
},
},
[Vue Router warn]: No match found for location with path "/items/navigation/main-menu"
@morkvitnir I just notice documentation is outdated for our case:
We need to arrange it inside public to be exposed:
runtimeConfig: {
public: {
directus: {
url: "http://localhost:8055",
},
},
},
This looks like it was fixed by d05719a and this issue should be closed.