Vue + Stripe: Module Not Found Can't resolve '@stripe/stripe-js'

This error is driving me crazy. I get it when I run npx mix watch or just npx mix, and I have tried running:

npm install @stripe/stripe-js 

and

npm install --save @stripe/stripe-js

and it says it's installed successfully, but my Vue component can't seem to find it to import:

<template>
    <Auth>
        
        <StripeElement :elements="elements" @blur="doSomething"/>
    </Auth>
</template>

<script>
import Auth from "@/Layouts/Auth";
import { loadStripe } from '@stripe/stripe-js'
import { ref, onBeforeMount } from 'vue';
import {StripeElements, StripeElement} from 'vue-stripe-js';

export default ({
    components: {
        Auth,
        Head
    },

    setup() {
        onBeforeMount(() => {
            console.log(process.env.MIX_STRIPE_KEY)
            const stripeLoaded = ref(false)
            const stripePromise = loadStripe(process.env.MIX_STRIPE_KEY)
            stripePromise.then(() => {
                stripeLoaded.value = true
            })
        })
    },
})
</script>

I have also tried to just include the Stripe JS script in my blade file before my app.js but that doesn't work either.

I have deleted my package-lock.json and run npm install but that didn't fix anything.

Any ideas what I'm doing wrong?