Declaring and Initializing variable in Vue 3

Issue

I am trying to upgrade vue 2.6.14 project to vue 3.0.0 project. In here I use typescript also.Here is my code.

export default defineComponent ({
        name : 'App',
        currentTheme: string = "defaultTheme",
        methods:{
            mounted() {
                var browserInfo = appService.getBrowserInfo();
                if (
                    browserInfo &&
                    !(
                        browserInfo.toString().startsWith("Edge") ||
                        browserInfo.toString().startsWith("Chrome") ||
                        browserInfo.toString().startsWith("Firefox")
                    )
                ) {
                    var alreadyRedirected = sessionStorage.getItem(
                        "redirectedToUnsupportedPage"
                    );
                    if (alreadyRedirected !== "1") {
                        this.$router.push({ name: "BrowserIncompatible" });
                        sessionStorage.setItem("redirectedToUnsupportedPage", "1");
                    }
                }
                if (
                    !(
                        this.$route.path.startsWith("/auth") ||
                        this.$route.path.startsWith("/error")
                    ) &&
                    !localStorage.getItem("loggedInUserId")
                ) {
                    this.$store.dispatch("destroyToken", {}).then((response) => {
                        this.$store.dispatch("removeToken");
                        this.$router.push({ name: "Auth" });
                    });
                }
                
                if (
                    (!sessionStorage.getItem("logoImageUri") ||
                        sessionStorage.getItem("logoImageUri") == "") &&
                    (!sessionStorage.getItem("favIconImageUri") ||
                        sessionStorage.getItem("favIconImageUri") == "")
                ) {
                    this.$store.dispatch("changeSystemSettings", {});
                } else {
                    var params = {
                        selectedColor: sessionStorage.getItem("baseColorCode"),
                        selectedSuccessColor: sessionStorage.getItem("baseSuccessColorCode"),
                        selectedWarningColor: sessionStorage.getItem("baseWarningColorCode"),
                        selectedErrorColor: sessionStorage.getItem("baseErrorColorCode"),
                    };
                    this.$store.dispatch("changeBaseColorCodes", params);
                }
        
                //this.$store.dispatch('fetchThemeSettings');
                this.$store.dispatch("setWebSiteVersion");
        
                var isClient = this.$store.getters.isAuthorizedRole(UserRoles.Client);
                if (isClient && this.$store.getters.getToken) {
                    var clientParams = { id: this.$store.getters.getToken.relatedEntityId }
                    this.$store.dispatch('storeIsBusyValue', true);
                    apiService.sendGetRequest('Client', 'ClientBasicDetails', clientParams).then(response => {
                        this.$store.dispatch('changeFirstName', response.data.firstName);
                        this.$store.dispatch('changeLastName', response.data.lastName);
                        this.$store.dispatch('storeIsBusyValue', false);
                    });
                }
            }
        }
    })

I want to declare currentTheme which is string type variable and initialize a string. But here I got an error called 'string' only refers to a type, but is being used as a value here.ts(2693) under string keyword. How can I resolve it? Is there any solution to solve this error?

Solution

As @EstusFlask answered, I was able to solve my question after changing as currentTheme: "defaultTheme" as string

Answered By - Kanchana Kariyawasam