How to avoid [Vue warn]: Injection "xxxx" not found

Question

I'm using inject/provide pattern in nuxt composition-api. For example, Component A inject the function provided by Component B which is parent of Component A like below.

//Component B 
const test = () => {}
provide('test', test)

//Component A 
const test = inject<Function>('test')

However when I want to use Component A without Component B, this warn is shown on console. I understand it's saying but in this case it doesn't need to use ''test'' function. Are there any way to avoid this warning ?

[Vue warn]: Injection "test" not found

Answer 1

To avoid the warning, specify a default value (the 2nd argument to inject()):

const test = inject<Function>('test', () => {})

demo