I can't use pinia outside of component setup

[rangeldor]

When I try to use it in the api.ts I get this error:
TypeError: Object(...) is not a function

api.ts

When I try to use it in the router.ts I get this error:
Uncaught Error: [🍍]: getActivePinia was called with no active Pinia. Did you forget to install pinia?

const pinia = createPinia()
app.use(pinia)

router.ts

[BenShelton]

That error is happening because you are trying to create a store before calling app.use(pinia) (or however you are initializing it)

Have a look at the docs here: https://pinia.esm.dev/core-concepts/outside-component-usage.html
Most importantly:

The easiest way to ensure this is always applied is to defer calls of useStore() by placing them inside functions that will always run after pinia is installed.

I can't see in your screenshots above where exactly you planned on using the userStore, but if it's in an Axios interceptor then call it within the interceptor function:

axios.interceptors.request.use(function (config) {
  const userStore = useUserStore()
  config.headers.Authorization = userStore.token
  return config
});

Or if it's in something like a router guard then you need to call the user store within the guard itself:

router.beforeEach((to) => {
  const userStore = useUserStore()
  if (!userStore.isLoggedIn) return '/login'
})

[BenShelton]

You can see a complete example here: https://codesandbox.io/s/pinia-vue-3-axios-interceptor-6jf11

Does this solve your problem @rangeldor ?

[rangeldor]

Hello @BenShelton! Thank you for reply.

I have already done it.

The problem is that I don't want put it in everywhere.

Ex:

If I use it out of the "if", I get error.

[rangeldor]

@BenShelton , I used of this form and worked!

Thank you!

[BenShelton]

@rangeldor Glad this worked for you.
To explain, you must retrieve the store within the interceptor's callback function but it can be the first thing you do in the callback (as you show above) if you want to access the store within the entire scope of the callback.

[JoeABCDEF]

请问 你是使用的 vscode吗 你的主题是啥

[rangeldor]

Hello!

I am using a Synthwave 84 blues from VSCode.

I enabled neon.

I hope I could have helped :)