programing

ES6 vuex Import 파일과 Import(내포된 Import)

randomtip 2022. 8. 17. 20:59
반응형

ES6 vuex Import 파일과 Import(내포된 Import)

VUE에서 VUEX를 사용하여 웹 앱을 구축하고 있습니다.모든 프로젝트에서 필요한 기본 코드를 가진 코드의 기본 "레이어"가 있기 때문에 여러 번 빌드할 필요가 없습니다.

Import할 수 있는 파일이 1개 있고 Import할 때 모든 모듈, 기본 계층의 기본 모듈 및 앱/프로젝트 전용 모듈을 로드하고 싶다.

내 디렉토리 구조:

  • src
    • 노점상
      • 상점들
        • 모듈
          • 디폴트 모듈1
          • 디폴트 모듈2
        • store.module(디폴트모듈을 로드합니다)
    • stores - module - module 1 - module 2 - store . js ( veux store object ) - storeloader . js ( store . js 와 모든 디폴트모듈 및 벤더의 디폴트모듈을 로드하는 벤더 store.js)

벤더/스토어/스토어.개요

import { apiRoutes } from './modules/apiRoutes';
import { authorization } from './modules/authorization';
import { store } from '@/stores/storeLoader';
store.registerModule('apiRoutes', apiRoutes);
store.registerModule('authorization', authorization);

stores/store.module(앱/프로젝트 스토어, vuex 스토어 객체)

import Vue from 'vue';
import Vuex from 'vuex';
import LocalStorage from '@/vendor/kingscode/base/LocalStorage';
Vue.use(Vuex);

export const store = new Vuex.Store({
    strict: true,
    state: LocalStorage.loadState('vuex_app') || {},

    /**
     * Getters.
     * (i.e. computed properties for stores)
     *
     * @see https://vuex.vuejs.org/en/getters.html
     */
    getters: {
        /**
         * Get the selected location id.
         *
         * @param state
         * @param getters
         */
        locationSelectedId: (state, getters) => () => {
            return state.location.id;
        },

        /**
         * Get the selected location id.
         *
         * @param state
         * @param getters
         */
        locationSelectedName: (state, getters) => () => {
            return state.location.name;
        }
    },

    /**
     * Mutations.
     *
     * @see https://vuex.vuejs.org/en/mutations.html
     */
    mutations: {

        /**
         * Set the location object.
         *
         * @param state
         * @param location
         */
        changeLocation(state, location) {
            let newUser = state.user;
            state.user.location = location
            Vue.set(state, 'user', newUser);
            LocalStorage.saveState('vuex_app', state);
        }
    },

    /**
     * Actions.
     *
     * @see https://vuex.vuejs.org/en/actions.html
     */
    actions: {

        //
    },
});

stores/storeloader.dloader.dload

import { store } from './store.js';
import { cart } from './modules/cart';
store.registerModule('cart', cart);
require('@/vendor/kingscode/stores/store');

이 코드의 문제는 몇 가지 점에서store인식되지 않고 모든 모듈에 로딩되지 않을 수 있습니다.올바른 방법 또는 전혀 다른 방법/아이디어를 찾고 있습니다.아마도 내가 하는 일은 이런 식으로 허락되거나 가능하지 않을 것이다.

누군가 내 뜻을 이해하고 도와줄 수 있기를 바랍니다.저는 많이 찾아봤지만 무엇을 찾고 있는지도 모르기 때문에, 어떤 도움을 받을 수 있으면 좋겠습니다.

언급URL : https://stackoverflow.com/questions/46647991/es6-vuex-import-file-with-imports-nested-imports

반응형