Alias in Vue

I am building an app with a Laravel backend api and a vue.js front end.

I am trying to create an alias so that I can import components without having to use relative paths, for example:

import {useUserStore} from "@/Store/user.js";

I have added the following to vite.config.js but it doesn't seem to work, is there anything else I need to do?

export default defineConfig({
    plugins: [
        vue(),
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    resolve: {
        alias: {
            '@': '/resources/js',
        },
    },
});