Add missing deps, fix errors from eslint

2022-12-16 11:14:19 -08:00
parent 2cba776dc8
commit 6fa827823c
21 changed files with 483 additions and 229 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -21,11 +21,12 @@ module.exports = {
    'plugin:vue/vue3-essential',
    'eslint:recommended',
    'plugin:prettier/recommended',
-    'prettier/vue',
+    'prettier',
  ],

  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+    'vue/multi-word-component-names': ['off'],
  },
 }
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,17 +21,21 @@
        "core-js": "^3.25.5",
        "css-loader": "^6.7.1",
        "eslint": "^8.25.0",
+        "eslint-config-prettier": "^8.5.0",
+        "eslint-formatter-friendly": "^7.0.0",
        "eslint-plugin-prettier": "^4.2.1",
        "eslint-plugin-vue": "^9.6.0",
        "eslint-webpack-plugin": "^3.2.0",
        "mini-css-extract-plugin": "^2.6.1",
+        "prettier": "^2.8.1",
        "rimraf": "^3.0.2",
        "style-loader": "^3.3.1",
        "vue": "^3.2.40",
        "vue-eslint-parser": "^9.1.0",
        "vue-loader": "^17.0.0",
        "vue-style-loader": "^4.1.3",
-        "webpack": "^5.74.0"
+        "webpack": "^5.74.0",
+        "webpack-merge": "^5.8.0"
      }
    },
    "node_modules/@ampproject/remapping": {
@@ -2482,6 +2486,20 @@
        "node": ">=6.0"
      }
    },
+    "node_modules/clone-deep": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
+      "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==",
+      "dev": true,
+      "dependencies": {
+        "is-plain-object": "^2.0.4",
+        "kind-of": "^6.0.2",
+        "shallow-clone": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
    "node_modules/color-convert": {
      "version": "1.9.3",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -2788,6 +2806,64 @@
        "url": "https://opencollective.com/eslint"
      }
    },
+    "node_modules/eslint-config-prettier": {
+      "version": "8.5.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.5.0.tgz",
+      "integrity": "sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==",
+      "dev": true,
+      "bin": {
+        "eslint-config-prettier": "bin/cli.js"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
+      }
+    },
+    "node_modules/eslint-formatter-friendly": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/eslint-formatter-friendly/-/eslint-formatter-friendly-7.0.0.tgz",
+      "integrity": "sha512-WXg2D5kMHcRxIZA3ulxdevi8/BGTXu72pfOO5vXHqcAfClfIWDSlOljROjCSOCcKvilgmHz1jDWbvFCZHjMQ5w==",
+      "dev": true,
+      "dependencies": {
+        "@babel/code-frame": "7.0.0",
+        "chalk": "2.4.2",
+        "extend": "3.0.2",
+        "strip-ansi": "5.2.0",
+        "text-table": "0.2.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/eslint-formatter-friendly/node_modules/@babel/code-frame": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.0.0.tgz",
+      "integrity": "sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/highlight": "^7.0.0"
+      }
+    },
+    "node_modules/eslint-formatter-friendly/node_modules/ansi-regex": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
+      "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
+      "dev": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/eslint-formatter-friendly/node_modules/strip-ansi": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+      "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+      "dev": true,
+      "dependencies": {
+        "ansi-regex": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
    "node_modules/eslint-plugin-prettier": {
      "version": "4.2.1",
      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz",
@@ -3142,6 +3218,12 @@
        "node": ">=0.8.x"
      }
    },
+    "node_modules/extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
+      "dev": true
+    },
    "node_modules/fast-deep-equal": {
      "version": "3.1.3",
      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -3547,12 +3629,33 @@
        "node": ">=0.12.0"
      }
    },
+    "node_modules/is-plain-object": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
+      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
+      "dev": true,
+      "dependencies": {
+        "isobject": "^3.0.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/isexe": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
      "dev": true
    },
+    "node_modules/isobject": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+      "integrity": "sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/jest-worker": {
      "version": "28.1.3",
      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-28.1.3.tgz",
@@ -3662,6 +3765,15 @@
      "resolved": "https://registry.npmjs.org/kdbush/-/kdbush-3.0.0.tgz",
      "integrity": "sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew=="
    },
+    "node_modules/kind-of": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
+      "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
    "node_modules/levn": {
      "version": "0.4.1",
      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -4306,11 +4418,10 @@
      }
    },
    "node_modules/prettier": {
-      "version": "2.7.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.7.1.tgz",
-      "integrity": "sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==",
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.1.tgz",
+      "integrity": "sha512-lqGoSJBQNJidqCHE80vqZJHWHRFoNYsSpP9AjFhlhi9ODCJA541svILes/+/1GM3VaL/abZi7cpFzOpdR9UPKg==",
      "dev": true,
-      "peer": true,
      "bin": {
        "prettier": "bin-prettier.js"
      },
@@ -4599,6 +4710,18 @@
        "randombytes": "^2.1.0"
      }
    },
+    "node_modules/shallow-clone": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz",
+      "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==",
+      "dev": true,
+      "dependencies": {
+        "kind-of": "^6.0.2"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
    "node_modules/shebang-command": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -4661,6 +4784,7 @@
      "version": "1.4.8",
      "resolved": "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz",
      "integrity": "sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==",
+      "deprecated": "Please use @jridgewell/sourcemap-codec instead",
      "dev": true
    },
    "node_modules/strip-ansi": {
@@ -5222,6 +5346,19 @@
        }
      }
    },
+    "node_modules/webpack-merge": {
+      "version": "5.8.0",
+      "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.8.0.tgz",
+      "integrity": "sha512-/SaI7xY0831XwP6kzuwhKWVKDP9t1QY1h65lAFLbZqMPIuYcD9QAW4u9STIbU9kaJbPBB/geU/gLr1wDjOhQ+Q==",
+      "dev": true,
+      "dependencies": {
+        "clone-deep": "^4.0.1",
+        "wildcard": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
    "node_modules/webpack-sources": {
      "version": "3.2.3",
      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
@@ -5292,6 +5429,12 @@
        "node": ">= 8"
      }
    },
+    "node_modules/wildcard": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.0.tgz",
+      "integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==",
+      "dev": true
+    },
    "node_modules/word-wrap": {
      "version": "1.2.3",
      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
@@ -7153,6 +7296,17 @@
      "integrity": "sha512-p3KULyQg4S7NIHixdwbGX+nFHkoBiA4YQmyWtjb8XngSKV124nJmRysgAeujbUVb15vh+RvFUfCPqU7rXk+hZg==",
      "dev": true
    },
+    "clone-deep": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
+      "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==",
+      "dev": true,
+      "requires": {
+        "is-plain-object": "^2.0.4",
+        "kind-of": "^6.0.2",
+        "shallow-clone": "^3.0.0"
+      }
+    },
    "color-convert": {
      "version": "1.9.3",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -7452,6 +7606,52 @@
        }
      }
    },
+    "eslint-config-prettier": {
+      "version": "8.5.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.5.0.tgz",
+      "integrity": "sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==",
+      "dev": true,
+      "requires": {}
+    },
+    "eslint-formatter-friendly": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/eslint-formatter-friendly/-/eslint-formatter-friendly-7.0.0.tgz",
+      "integrity": "sha512-WXg2D5kMHcRxIZA3ulxdevi8/BGTXu72pfOO5vXHqcAfClfIWDSlOljROjCSOCcKvilgmHz1jDWbvFCZHjMQ5w==",
+      "dev": true,
+      "requires": {
+        "@babel/code-frame": "7.0.0",
+        "chalk": "2.4.2",
+        "extend": "3.0.2",
+        "strip-ansi": "5.2.0",
+        "text-table": "0.2.0"
+      },
+      "dependencies": {
+        "@babel/code-frame": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.0.0.tgz",
+          "integrity": "sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==",
+          "dev": true,
+          "requires": {
+            "@babel/highlight": "^7.0.0"
+          }
+        },
+        "ansi-regex": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
+          "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "5.2.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+          "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^4.1.0"
+          }
+        }
+      }
+    },
    "eslint-plugin-prettier": {
      "version": "4.2.1",
      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz",
@@ -7627,6 +7827,12 @@
      "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
      "dev": true
    },
+    "extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
+      "dev": true
+    },
    "fast-deep-equal": {
      "version": "3.1.3",
      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -7939,12 +8145,27 @@
      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
      "dev": true
    },
+    "is-plain-object": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
+      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
+      "dev": true,
+      "requires": {
+        "isobject": "^3.0.1"
+      }
+    },
    "isexe": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
      "dev": true
    },
+    "isobject": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+      "integrity": "sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==",
+      "dev": true
+    },
    "jest-worker": {
      "version": "28.1.3",
      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-28.1.3.tgz",
@@ -8029,6 +8250,12 @@
      "resolved": "https://registry.npmjs.org/kdbush/-/kdbush-3.0.0.tgz",
      "integrity": "sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew=="
    },
+    "kind-of": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
+      "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
+      "dev": true
+    },
    "levn": {
      "version": "0.4.1",
      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -8491,11 +8718,10 @@
      "dev": true
    },
    "prettier": {
-      "version": "2.7.1",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.7.1.tgz",
-      "integrity": "sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==",
-      "dev": true,
-      "peer": true
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.1.tgz",
+      "integrity": "sha512-lqGoSJBQNJidqCHE80vqZJHWHRFoNYsSpP9AjFhlhi9ODCJA541svILes/+/1GM3VaL/abZi7cpFzOpdR9UPKg==",
+      "dev": true
    },
    "prettier-linter-helpers": {
      "version": "1.0.0",
@@ -8679,6 +8905,15 @@
        "randombytes": "^2.1.0"
      }
    },
+    "shallow-clone": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz",
+      "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==",
+      "dev": true,
+      "requires": {
+        "kind-of": "^6.0.2"
+      }
+    },
    "shebang-command": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -9148,6 +9383,16 @@
        }
      }
    },
+    "webpack-merge": {
+      "version": "5.8.0",
+      "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.8.0.tgz",
+      "integrity": "sha512-/SaI7xY0831XwP6kzuwhKWVKDP9t1QY1h65lAFLbZqMPIuYcD9QAW4u9STIbU9kaJbPBB/geU/gLr1wDjOhQ+Q==",
+      "dev": true,
+      "requires": {
+        "clone-deep": "^4.0.1",
+        "wildcard": "^2.0.0"
+      }
+    },
    "webpack-sources": {
      "version": "3.2.3",
      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz",
@@ -9163,6 +9408,12 @@
        "isexe": "^2.0.0"
      }
    },
+    "wildcard": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.0.tgz",
+      "integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==",
+      "dev": true
+    },
    "word-wrap": {
      "version": "1.2.3",
      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
--- a/package.json
+++ b/package.json
@@ -27,17 +27,21 @@
    "core-js": "^3.25.5",
    "css-loader": "^6.7.1",
    "eslint": "^8.25.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-formatter-friendly": "^7.0.0",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-vue": "^9.6.0",
    "eslint-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^2.6.1",
+    "prettier": "^2.8.1",
    "rimraf": "^3.0.2",
    "style-loader": "^3.3.1",
    "vue": "^3.2.40",
    "vue-eslint-parser": "^9.1.0",
    "vue-loader": "^17.0.0",
    "vue-style-loader": "^4.1.3",
-    "webpack": "^5.74.0"
+    "webpack": "^5.74.0",
+    "webpack-merge": "^5.8.0"
  },
  "homepage": "https://vue-google-maps-community-fork.netlify.app",
  "license": "MIT",
--- a/src/components/autocomplete.vue
+++ b/src/components/autocomplete.vue
@@ -1,16 +1,8 @@
 <template>
  <template v-if="$slots['input']">
-    <slot
-      name="input"
-      v-bind="$attrs"
-    ></slot>
+    <slot name="input" v-bind="$attrs"></slot>
  </template>
-  <input
-    v-else-if="!$slots['input']"
-    ref="input"
-    v-bind="$attrs"
-    v-on="$attrs"
-  />
+  <input v-else-if="!$slots['input']" ref="input" v-bind="$attrs" v-on="$attrs" />
 </template>

 <script>
@@ -49,15 +41,15 @@ const props = {

 export default {
  mounted() {
-    const _this = this;
+    const _this = this
    this.$gmapApiPromiseLazy().then(() => {
      // get correct input from fallback or slot
      let refInput = _this.$refs.input
      if (_this.$slots.input) {
-        const refName = _this.$slots.input()[0].props.ref;
-        const scopedInput = _this.$slots.input()[0].ref.i.ctx.$refs[refName];
+        const refName = _this.$slots.input()[0].props.ref
+        const scopedInput = _this.$slots.input()[0].ref.i.ctx.$refs[refName]
        if (scopedInput) {
-          refInput = scopedInput.$el.getElementsByTagName('input')[0];
+          refInput = scopedInput.$el.getElementsByTagName('input')[0]
        }
      }
      if (this.selectFirstOnEnter) {
--- a/src/components/build-component.js
+++ b/src/components/build-component.js
@@ -44,17 +44,8 @@ import MapElementMixin from './mapElementMixin'
 *
 */
 export default function (options) {
-  const {
-    mappedProps,
-    name,
-    ctr,
-    ctrArgs,
-    events,
-    beforeCreate,
-    afterCreate,
-    props,
-    ...rest
-  } = options
+  const { mappedProps, name, ctr, ctrArgs, events, beforeCreate, afterCreate, props, ...rest } =
+    options

  const promiseName = `$${name}Promise`
  const instanceName = `$${name}Object`
--- a/src/components/cluster.vue
+++ b/src/components/cluster.vue
@@ -4,8 +4,12 @@
  </div>
 </template>
 <script>
-import {DefaultRenderer, MarkerClusterer, SuperClusterAlgorithm} from '@googlemaps/markerclusterer';
-import buildComponent from './build-component.js';
+import {
+  DefaultRenderer,
+  MarkerClusterer,
+  SuperClusterAlgorithm,
+} from '@googlemaps/markerclusterer'
+import buildComponent from './build-component.js'

 const props = {
  algorithm: {
@@ -15,15 +19,12 @@ const props = {
  },
  renderer: {
    type: Object,
-    default: new DefaultRenderer,
+    default: new DefaultRenderer(),
    noBind: true,
  },
-};
+}

-const events = [
-  'clusteringbegin',
-  'clusteringend',
-];
+const events = ['clusteringbegin', 'clusteringend']

 export default buildComponent({
  mappedProps: props,
@@ -31,28 +32,28 @@ export default buildComponent({
  name: 'cluster',
  ctr: () => {
    if (typeof MarkerClusterer === 'undefined') {
-      const errorMessage = 'MarkerClusterer is not installed!';
-      console.error(errorMessage);
-      throw new Error(errorMessage);
+      const errorMessage = 'MarkerClusterer is not installed!'
+      console.error(errorMessage)
+      throw new Error(errorMessage)
    }
-    return MarkerClusterer;
+    return MarkerClusterer
  },
-  ctrArgs: ({map, ...otherOptions}) => [{map, ...otherOptions}],
+  ctrArgs: ({ map, ...otherOptions }) => [{ map, ...otherOptions }],
  afterCreate(inst) {
    const reinsertMarkers = () => {
-      const oldMarkers = inst.getMarkers();
-      inst.clearMarkers();
-      inst.addMarkers(oldMarkers);
-    };
+      const oldMarkers = inst.getMarkers()
+      inst.clearMarkers()
+      inst.addMarkers(oldMarkers)
+    }
    for (let prop in props) {
      if (props[prop].twoWay) {
-        this.$on(prop.toLowerCase() + '_changed', reinsertMarkers);
+        this.$on(prop.toLowerCase() + '_changed', reinsertMarkers)
      }
    }
  },
  updated() {
    if (this.$clusterObject) {
-      this.$clusterObject.render();
+      this.$clusterObject.render()
    }
  },
  beforeUnmount() {
@@ -60,14 +61,14 @@ export default buildComponent({
    if (this.$children && this.$children.length) {
      this.$children.forEach((marker) => {
        if (marker.$clusterObject === this.$clusterObject) {
-          marker.$clusterObject = null;
+          marker.$clusterObject = null
        }
-      });
+      })
    }

    if (this.$clusterObject) {
-      this.$clusterObject.clearMarkers();
+      this.$clusterObject.clearMarkers()
    }
  },
-});
+})
 </script>
--- a/src/components/heatmap.js
+++ b/src/components/heatmap.js
@@ -4,16 +4,15 @@ const props = {
  options: {
    type: Object,
    twoWay: false,
-    default: () => {
-    },
+    default: () => {},
  },
  data: {
    type: Array,
-    twoWay: true
+    twoWay: true,
  },
 }

-const events = [];
+const events = []

 export default buildComponent({
  mappedProps: props,
@@ -21,5 +20,3 @@ export default buildComponent({
  ctr: () => google.maps.visualization.HeatmapLayer,
  events,
 })
-
-
--- a/src/components/map.vue
+++ b/src/components/map.vue
@@ -103,7 +103,19 @@ const customMethods = {

 export default {
  mixins: [mountableMixin],
-  props: mappedPropsToVueProps({...props, ...events.reduce((obj, eventName) => ({...obj, [`on${eventName.charAt(0).toUpperCase()}${eventName.slice(1)}`.replace(/[-_]+(.)?/g, (_, c) => c ? c.toUpperCase() : '')]: Function}), {}) } ),
+  props: mappedPropsToVueProps({
+    ...props,
+    ...events.reduce(
+      (obj, eventName) => ({
+        ...obj,
+        [`on${eventName.charAt(0).toUpperCase()}${eventName.slice(1)}`.replace(
+          /[-_]+(.)?/g,
+          (_, c) => (c ? c.toUpperCase() : '')
+        )]: Function,
+      }),
+      {}
+    ),
+  }),
  inheritAttrs: false,

  provide() {
--- a/src/components/marker.vue
+++ b/src/components/marker.vue
@@ -1,10 +1,15 @@
 <template>
-  <div @click="()=> {console.log('sdfsd')}">
+  <div
+    @click="
+      () => {
+        console.log('sdfsd')
+      }
+    "
+  >
    <slot></slot>
  </div>
 </template>
 <script>
-
 import buildComponent from './build-component.js'

 const props = {
@@ -112,10 +117,10 @@ export default buildComponent({
  },

  afterCreate(inst) {
-    events.forEach((event)=> {
-      inst.addListener(event, (payload)=> {
+    events.forEach((event) => {
+      inst.addListener(event, (payload) => {
        this.$emit(event, payload)
-      });
+      })
    })
    if (this.$clusterPromise) {
      this.$clusterPromise.then((co) => {
--- a/src/components/polygon.js
+++ b/src/components/polygon.js
@@ -83,9 +83,11 @@ export default buildComponent({
          eventListeners.push([mvcArray, mvcArray.addListener('set_at', updatePaths)])

          clearEvents = () => {
-            eventListeners.map((
-              [obj, listenerHandle] // eslint-disable-line no-unused-vars
-            ) => google.maps.event.removeListener(listenerHandle))
+            eventListeners.map(
+              (
+                [obj, listenerHandle] // eslint-disable-line no-unused-vars
+              ) => google.maps.event.removeListener(listenerHandle)
+            )
          }
        }
      },
@@ -115,9 +117,11 @@ export default buildComponent({
          eventListeners.push([mvcPath, mvcPath.addListener('set_at', updatePaths)])

          clearEvents = () => {
-            eventListeners.map((
-              [obj, listenerHandle] // eslint-disable-line no-unused-vars
-            ) => google.maps.event.removeListener(listenerHandle))
+            eventListeners.map(
+              (
+                [obj, listenerHandle] // eslint-disable-line no-unused-vars
+              ) => google.maps.event.removeListener(listenerHandle)
+            )
          }
        }
      },
--- a/src/components/polyline.js
+++ b/src/components/polyline.js
@@ -67,9 +67,11 @@ export default buildComponent({
          eventListeners.push([mvcPath, mvcPath.addListener('set_at', updatePaths)])

          clearEvents = () => {
-            eventListeners.map((
-              [obj, listenerHandle] // eslint-disable-line no-unused-vars
-            ) => google.maps.event.removeListener(listenerHandle))
+            eventListeners.map(
+              (
+                [obj, listenerHandle] // eslint-disable-line no-unused-vars
+              ) => google.maps.event.removeListener(listenerHandle)
+            )
          }
        }
      },
--- a/src/load-google-maps.js
+++ b/src/load-google-maps.js
@@ -1,16 +1,15 @@
-import {Env} from "./utils/env";
-import {createMapScript} from "./utils/create-map-script";
+import { Env } from './utils/env'
+import { createMapScript } from './utils/create-map-script'

 let isApiSetUp = false
-export function loadGMapApi (options) {
-
+export function loadGMapApi(options) {
  if (Env.isServer()) {
-    return;
+    return
  }

  if (!isApiSetUp) {
    isApiSetUp = true
-    const googleMapScript = createMapScript(options);
+    const googleMapScript = createMapScript(options)
    document.head.appendChild(googleMapScript)
  } else {
    throw new Error('You already started the loading of google maps')
--- a/src/main.js
+++ b/src/main.js
@@ -15,8 +15,8 @@ import Autocomplete from './components/autocomplete.vue'
 import MapElementMixin from './components/mapElementMixin'
 import buildComponent from './components/build-component'
 import MountableMixin from './utils/mountableMixin'
-import {Env} from "./utils/env";
-let GMapApi = null;
+import { Env } from './utils/env'
+let GMapApi = null

 export {
  loadGMapApi,
--- a/src/utils/bindEvents.js
+++ b/src/utils/bindEvents.js
@@ -1,6 +1,9 @@
 export default (vueInst, googleMapsInst, events) => {
  for (let eventName of events) {
-    const propName = `on${eventName.charAt(0).toUpperCase()}${eventName.slice(1)}`.replace(/[-_]+(.)?/g, (_, c) => c ? c.toUpperCase() : '');
+    const propName = `on${eventName.charAt(0).toUpperCase()}${eventName.slice(1)}`.replace(
+      /[-_]+(.)?/g,
+      (_, c) => (c ? c.toUpperCase() : '')
+    )

    if (vueInst.$props[propName] || vueInst.$attrs[propName]) {
      googleMapsInst.addListener(eventName, (ev) => {
--- a/src/utils/bindProps.js
+++ b/src/utils/bindProps.js
@@ -1,5 +1,5 @@
 import WatchPrimitiveProperties from '../utils/WatchPrimitiveProperties'
-import {Str} from "./string";
+import { Str } from './string'

 export function getPropsValues(vueInst, props) {
  return Object.keys(props).reduce((acc, prop) => {
@@ -39,7 +39,8 @@ export function bindProps(vueInst, googleMapsInst, props) {
    // although this may really be the user's responsibility
    if (type !== Object || !trackProperties) {
      // Track the object deeply
-      vueInst.$watch(attribute,
+      vueInst.$watch(
+        attribute,
        () => {
          const attributeValue = vueInst[attribute]

--- a/src/utils/create-map-script.js
+++ b/src/utils/create-map-script.js
@@ -15,11 +15,12 @@ export function createMapScript(options) {
  let url =
    baseUrl +
    Object.keys(options)
-      .map((key) => encodeURIComponent(key) + '=' + encodeURIComponent(options[key])).join('&')
+      .map((key) => encodeURIComponent(key) + '=' + encodeURIComponent(options[key]))
+      .join('&')

  googleMapScript.setAttribute('src', url)
  googleMapScript.setAttribute('async', '')
  googleMapScript.setAttribute('defer', '')

-  return googleMapScript;
+  return googleMapScript
 }
--- a/src/utils/env.js
+++ b/src/utils/env.js
@@ -1,5 +1,5 @@
 export class Env {
  static isServer() {
-    return typeof document === 'undefined';
+    return typeof document === 'undefined'
  }
 }
--- a/src/utils/event.js
+++ b/src/utils/event.js
@@ -1,3 +0,0 @@
-export class eventUtils {
-
-}
--- a/src/utils/lazyValue.js
+++ b/src/utils/lazyValue.js
@@ -1,15 +1,15 @@
 // lazy-value by sindresorhus

-export default fn => {
-  let called = false;
-  let result;
+export default (fn) => {
+  let called = false
+  let result

  return () => {
    if (!called) {
-      called = true;
-      result = fn();
+      called = true
+      result = fn()
    }

-    return result;
-  };
-};
+    return result
+  }
+}
--- a/src/utils/load-google-maps.js
+++ b/src/utils/load-google-maps.js
@@ -1,143 +1,136 @@
 export class Loader {
-    constructor({
-                    apiKey,
-                    libraries = [],
-                    language,
-                    region,
-                    version,
-                    mapIds
-                }) {
-        // @ts-ignore
-        this.callbacks = [];
-        this.CALLBACK = "__googleMapsCallback";
-        this.version = version;
-        this.apiKey = apiKey;
-        this.libraries = libraries;
-        // @ts-ignore
-        this.language = language;
-        // @ts-ignore
-        this.region = region;
-        this.URL = 'https://maps.googleapis.com/maps/api/js';
-        // @ts-ignore
-        this.mapIds = mapIds;
-    }
-    /**
-     * CreateUrl returns the Google Maps JavaScript API script url given the [[LoaderOptions]].
-     *
-     * @ignore
-     */
-    createUrl() {
-        let url = this.URL;
-        console.log(this.URL)
+  constructor({ apiKey, libraries = [], language, region, version, mapIds }) {
+    // @ts-ignore
+    this.callbacks = []
+    this.CALLBACK = '__googleMapsCallback'
+    this.version = version
+    this.apiKey = apiKey
+    this.libraries = libraries
+    // @ts-ignore
+    this.language = language
+    // @ts-ignore
+    this.region = region
+    this.URL = 'https://maps.googleapis.com/maps/api/js'
+    // @ts-ignore
+    this.mapIds = mapIds
+  }
+  /**
+   * CreateUrl returns the Google Maps JavaScript API script url given the [[LoaderOptions]].
+   *
+   * @ignore
+   */
+  createUrl() {
+    let url = this.URL
+    console.log(this.URL)

-        url += `?callback=${this.CALLBACK}`;
+    url += `?callback=${this.CALLBACK}`

-        if (this.apiKey) {
-            url += `&key=${this.apiKey}`;
-        }
-
-        if (this.libraries.length > 0) {
-            url += `&libraries=${this.libraries.join(",")}`;
-        }
-
-        if (this.language) {
-            url += `&language=${this.language}`;
-        }
-
-        if (this.region) {
-            url += `&region=${this.region}`;
-        }
-
-        if (this.version) {
-            url += `&v=${this.version}`;
-        }
-
-        if (this.mapIds) {
-            url += `&map_ids=${this.mapIds.join(",")}`;
-        }
-
-        return url;
+    if (this.apiKey) {
+      url += `&key=${this.apiKey}`
    }

-    /**
-     * Load the Google Maps JavaScript API script and return a Promise.
-     */
-    load() {
-        return this.loadPromise();
+    if (this.libraries.length > 0) {
+      url += `&libraries=${this.libraries.join(',')}`
    }

-    /**
-     * Load the Google Maps JavaScript API script and return a Promise.
-     *
-     * @ignore
-     */
-    loadPromise() {
-        return new Promise((resolve, reject) => {
-            this.loadCallback((err) => {
-                if (!err) {
-                    resolve();
-                } else {
-                    reject(err);
-                }
-            });
-        });
+    if (this.language) {
+      url += `&language=${this.language}`
    }

-    /**
-     * Load the Google Maps JavaScript API script with a callback.
-     */
-    loadCallback(fn) {
-        this.callbacks.push(fn);
-        this.execute();
+    if (this.region) {
+      url += `&region=${this.region}`
    }

-    /**
-     * Set the script on document.
-     */
-    setScript() {
-        const url = this.createUrl();
-        const script = document.createElement("script");
-
-        script.type = "text/javascript";
-        script.src = url;
-        // @ts-ignore
-        script.onerror = this.loadErrorCallback.bind(this);
-        script.defer = true;
-        script.async = true;
-        document.head.appendChild(script);
+    if (this.version) {
+      url += `&v=${this.version}`
    }

-    loadErrorCallback(e) {
-        this.onerrorEvent = e;
-        this.callback();
+    if (this.mapIds) {
+      url += `&map_ids=${this.mapIds.join(',')}`
    }

-    setCallback() {
-        window.__googleMapsCallback = this.callback.bind(this);
-    }
+    return url
+  }

-    callback() {
-        this.done = true;
-        this.loading = false;
+  /**
+   * Load the Google Maps JavaScript API script and return a Promise.
+   */
+  load() {
+    return this.loadPromise()
+  }

-        this.callbacks.forEach(cb => {
-            cb(this.onerrorEvent);
-        });
-
-        this.callbacks = [];
-    }
-
-    execute() {
-        if (this.done) {
-            this.callback();
+  /**
+   * Load the Google Maps JavaScript API script and return a Promise.
+   *
+   * @ignore
+   */
+  loadPromise() {
+    return new Promise((resolve, reject) => {
+      this.loadCallback((err) => {
+        if (!err) {
+          resolve()
        } else {
-            if (this.loading) {
-                // do nothing but wait
-            } else {
-                this.loading = true;
-                this.setCallback();
-                this.setScript();
-            }
+          reject(err)
        }
+      })
+    })
+  }
+
+  /**
+   * Load the Google Maps JavaScript API script with a callback.
+   */
+  loadCallback(fn) {
+    this.callbacks.push(fn)
+    this.execute()
+  }
+
+  /**
+   * Set the script on document.
+   */
+  setScript() {
+    const url = this.createUrl()
+    const script = document.createElement('script')
+
+    script.type = 'text/javascript'
+    script.src = url
+    // @ts-ignore
+    script.onerror = this.loadErrorCallback.bind(this)
+    script.defer = true
+    script.async = true
+    document.head.appendChild(script)
+  }
+
+  loadErrorCallback(e) {
+    this.onerrorEvent = e
+    this.callback()
+  }
+
+  setCallback() {
+    window.__googleMapsCallback = this.callback.bind(this)
+  }
+
+  callback() {
+    this.done = true
+    this.loading = false
+
+    this.callbacks.forEach((cb) => {
+      cb(this.onerrorEvent)
+    })
+
+    this.callbacks = []
+  }
+
+  execute() {
+    if (this.done) {
+      this.callback()
+    } else {
+      if (this.loading) {
+        // do nothing but wait
+      } else {
+        this.loading = true
+        this.setCallback()
+        this.setScript()
+      }
    }
+  }
 }
--- a/src/utils/mountableMixin.js
+++ b/src/utils/mountableMixin.js
@@ -29,7 +29,7 @@ export default {
      this.resize()
    },
    isFunction(functionToCheck) {
-      return functionToCheck && {}.toString.call(functionToCheck) === '[object Function]';
+      return functionToCheck && {}.toString.call(functionToCheck) === '[object Function]'
    },
    _delayedResizeCallback() {
      this.$nextTick(() => this._resizeCallback())