как получить доступ к состоянию $ store в файле js

Question

Я пытаюсь получить доступ к состояниям vuex, но он возвращает null .

это resize.js :

import Vue from 'vue'
import store from '../store'

console.log(store.getters.getBrowserSize.width)

и я импортировал это файл main.js

это store.js :

export default new Vuex.Store({
    state: {
        browser: {
            width: null,
            height: null,
            breakPoint: ''
        }
    },
    mutations: {
        setBrowserSize(state, payload) {
            [state.browser.width, state.browser.height, state.browser.breakPoint] = [payload.width, payload.height, payload.breakPoint];
        }
    },
    actions: {},
    getters: {
        getBrowserSize(state) {
            return state.browser;
        }
    }
})

все в store.js нормально и работает (я проверил тему в vue-dev-tools)

и это App.vue : здесь я получаю ширину и высоту браузера и устанавливаю тему в состояние.

data() {
            return {
                browser: {
                    width: null,
                    height: null,
                    breakPoint: ''
                }
            }
        },
        methods: {
            currentBreakPoint() {
                let width = window.innerWidth;
                if (width >= process.env.SIZE_XL[1]) {
                    this.browser.breakPoint = process.env.SIZE_XL[0];
                } else if (width <= process.env.SIZE_XL[1] && width >= process.env.SIZE_LG[1]) {
                    this.browser.breakPoint = process.env.SIZE_LG[0]
                } else if (width <= process.env.SIZE_LG[1] && width >= process.env.SIZE_MD[1]) {
                    this.browser.breakPoint = process.env.SIZE_MD[0]
                } else if (width <= process.env.SIZE_SM[1]) {
                    this.browser.breakPoint = process.env.SIZE_SM[0]
                }
            },
            browserSize(width, height) {
                [this.browser.width, this.browser.height] = [width, height];
                this.$store.commit("setBrowserSize", this.browser);
            }
        },
        mounted() {
            this.currentBreakPoint();
            this.browserSize(window.innerWidth, window.innerHeight);
            window.addEventListener("resize", () => {
                this.currentBreakPoint();
                this.browserSize(window.innerWidth, window.innerHeight);
            });
        },

и для .env я установил плагин и использовал переменную env в vue.config.js , и все там работает нормально.

Я думаю, что вся проблема вызвана тем, что я хочу получить значение состояния в файле js (не в компоненте vue).

что с этим не так?

vue.config.js для env:

module.exports = {
    pluginOptions:{
        env: {
            SIZE_XL: ['xl', 1280],
            SIZE_LG: ['lg', 1024],
            SIZE_MD: ['md', 768],
            SIZE_SM: ['sm', 640]
        }
    }
}