Cannot use vue-resource in vue.js project

Question

I'm using vue.js and I'm trying to use vue-resource (https://github.com/pagekit/vue-resource) in my project.

Unfortunately, I'm getting this error:

vue-resource.esm.js:1434 Uncaught TypeError: Object.defineProperties called on non-object
    at Function.defineProperties (<anonymous>)
    at plugin (vue-resource.esm.js:1434:10)
    at Object.use (runtime-core.esm-bundler.js:3755:11)
    at main.js?t=1688947032869:15:5

This is my vue.js code:

import './assets/main.css'

import { createApp } from 'vue'
import { createPinia } from 'pinia'

import App from './App.vue'
import router from './router'
import resource from 'vue-resource'

const app = createApp(App)

app.use(createPinia())
app.use(router)
app.use(resource)

app.mount('#app')

and this is my package.json:

{
  "name": "routing",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "test:unit": "vitest",
    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore",
    "format": "prettier --write src/"
  },
  "dependencies": {
    "pinia": "^2.1.3",
    "vue": "^3.3.4",
    "vue-resource": "^1.5.3",
    "vue-router": "^4.2.2"
  },
  "devDependencies": {
    "@rushstack/eslint-patch": "^1.2.0",
    "@vitejs/plugin-vue": "^4.2.3",
    "@vitejs/plugin-vue-jsx": "^3.0.1",
    "@vue/eslint-config-prettier": "^7.1.0",
    "@vue/test-utils": "^2.3.2",
    "eslint": "^8.39.0",
    "eslint-plugin-vue": "^9.11.0",
    "jsdom": "^22.1.0",
    "prettier": "^2.8.8",
    "vite": "^4.3.9",
    "vitest": "^0.32.0"
  }
}

What did I miss?