Vue: импортировать объект в состояние хранилища vuex

Question

Я добавляю различные настройки в магазин Vuex, которые я использую, и обновляю их с помощью различных компонентов.Настройки подразделяются на объекты, но файл store.js становится довольно длинным, есть ли возможность импортировать эти объекты из независимых файлов, чтобы обзор был более понятным и каждый параметр мог иметь свой собственный файл?

export const store = new Vuex.Store({
    state: {

        // @import settings1 from 'settings1.js'
        // @import settings2 from 'settings2.js
        // @import settings3 from  'settings3.js
        // ...

        // instead of adding objects like this:
        settings1: {
            name1: value1,
            name2: value2,
            name3: value3,
            // ...
        },
        settings2: {
            name1: value1,
            name2: value2,
            name3: value3,
            // ...
        },
        settings3: {
            name1: value1,
            name2: value2,
            name3: value3,
            // ...
        }
    }
});

Answer 1

Вы экспортируете объекты для вставки в родительский объект.

import settings1 from './settings1'
import settings2 from './settings2'

// or 

const settings1 = require('./settings1')
const settings2 = require ('./settings2')

export const store = new Vuex.Store({
    state: {settings1,settings2}
});

settings1.js

module.exports = {
   value1: 1,
   value2: 2,
}

// or even better if using `import` instead of `require`

export default {
   value1: 1,
   value2: 2,
}

settings2.js

module.exports = {
   value3: 2,
   value4: 4,
}

// or even better if using `import` instead of `require`

export default {
   value3: 3,
   value4: 4,
}

Answer 2

Я думаю, что это работает так же, как в обычном js и работает так:

import settings1 from './settings1'
import settings2 from './settings2'
import settings3 from  './settings3'

export const store = new Vuex.Store({
    state: {
        settings1,
        settings2,
        settings3
    }
});