Issues with vue-loader

Question

I ran into some issues with vue-loader while trying to create a vue project. I started out creating a project with vue init. Next up I added Firebase by running npm install firebase and adding import firebase from "firebase"; and

let config = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_PROJECT_ID.firebaseapp.com",
  databaseURL: "https://YOUR_PROJECT_ID.firebaseio.com",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_PROJECT_ID.appspot.com",
  messagingSenderId: "YOUR_MESSAGING_SEND_ID"
};
firebase.initializeApp(config);

to my main.js file. When I tried to run this with npm run serve, I got the error "Error: Cannot find module 'vue-loader/package.json'". So I tried to install vue-loader through npm, after which I got a different error because I was missing @vue/compiler-sfc.

After I did this the app worked for a very short bit, until I tried to install Vuetify.

I added Vuetify to my main.js and now I'm getting the error

Error: [VuetifyLoaderPlugin Error] No matching rule for vue-loader found. Make sure there is at least one root-level rule that uses vue-loader.

From my package.json:

"dependencies": {
    "@vue/compiler-sfc": "^3.0.0",
    "core-js": "^3.6.5",
    "firebase": "^7.23.0",
    "vue": "^2.6.11",
    "vue-loader": "^15.9.3",
    "vue-meta": "^2.4.0",
    "vue-router": "^3.4.6",
    "vuetify": "^2.2.11"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^4.5.0",
    "@vue/cli-plugin-eslint": "^4.5.0",
    "@vue/cli-service": "^4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "sass": "^1.19.0",
    "sass-loader": "^8.0.0",
    "vue-cli-plugin-vuetify": "^2.0.7",
    "vue-template-compiler": "^2.6.11",
    "vuetify-loader": "^1.3.0"
  },