Use vite as bundler

src/components/Join.vue

@@ -4,7 +4,7 @@
       <div>
         <div class="text-center">
           <v-avatar class="join-avatar">
-            <v-img v-if="roomAvatar" :src="roomAvatar" />
+            <AuthedImage v-if="roomAvatar" :src="roomAvatar" />
             <span v-else class="white--text headline">
               {{ roomName.substring(0, 1).toUpperCase() }}
             </span>
@@ -50,7 +50,7 @@
             {{ $t("join.joining_as") }}
             <div class="d-inline-block">
               <v-avatar color="#e0e0e0">
-                <v-img v-if="userAvatar" :src="userAvatar" />
+                <AuthedImage v-if="userAvatar" :src="userAvatar" />
                 <span v-else class="white--text headline">{{ userAvatarLetter }}</span>
               </v-avatar>
             </div>
@@ -134,13 +134,15 @@ import LanguageMixin from "./languageMixin";
 import rememberMeMixin from "./rememberMeMixin";
 import logoMixin from "./logoMixin";
 import SelectLanguageDialog from "./SelectLanguageDialog.vue";
+import AuthedImage from "./AuthedImage.vue";
 
 export default {
   name: "Join",
   mixins: [LanguageMixin, rememberMeMixin, logoMixin],
   components: {
     SelectLanguageDialog,
-    InteractiveAuth
+    InteractiveAuth,
+    AuthedImage
   },
   data() {
     return {
@@ -194,7 +196,7 @@ export default {
       if (!this.$matrix.userAvatar) {
         return null;
       }
-      return this.$matrix.matrixClient.mxcUrlToHttp(this.$matrix.userAvatar, 80, 80, "scale", true);
+      return this.$matrix.matrixClient.mxcUrlToHttp(this.$matrix.userAvatar, 80, 80, "scale", true, undefined, this.$matrix.useAuthedMedia);
     },
 
     userAvatarLetter() {