vue动态添加store、路由和国际化配置方式

为了动态添加 store、路由和国际化配置，可以使用 Vue.js 提供的插件系统。下面是具体的步骤：

1. 动态添加 store

首先，我们需要创建一个新的 store 模块。这可以通过在一个 JavaScript 文件中定义一个新模块来完成，如下所示：

// myModule.js

export default {
  state: {
    foo: 'bar'
  },
  mutations: {
    updateFoo(state, value) {
      state.foo = value;
    }
  }
}

然后，我们在 Vue.js 实例中使用 store.registerModule() 方法将这个模块添加到 store 中，如下所示：

// main.js

import Vue from 'vue';
import Vuex from 'vuex';
import myModule from './myModule';

Vue.use(Vuex);

const store = new Vuex.Store();

// Add a module dynamically
store.registerModule('myModule', myModule);

1. 动态添加路由

同样地，我们需要创建一个新的路由模块。这可以通过在一个 JavaScript 文件中定义一个新模块来完成，如下所示：

// myRoutes.js

export default [
  {
    path: '/foo',
    component: Foo
  },
  {
    path: '/bar',
    component: Bar
  }
];

然后我们在 Vue.js 实例中使用 router.addRoutes() 方法将这个模块添加到路由中，如下所示：

// main.js

import Vue from 'vue';
import VueRouter from 'vue-router';
import myRoutes from './myRoutes';

Vue.use(VueRouter);

const router = new VueRouter({
  mode: 'history',
  routes: []
});

// Add routes dynamically
router.addRoutes(myRoutes);

1. 动态添加国际化配置

对于国际化，我们可以使用 vue-i18n 库。首先，我们需要定义一个新的语言包。这可以通过在一个 JavaScript 文件中定义一个新模块来完成，如下所示：

// myLangPackage.js

export default {
  en: {
    message: {
        hello: 'Hello'
    }
  },
  fr: {
    message: {
        hello: 'Bonjour'
    }
  }
};

然后，我们在 Vue.js 实例中使用 i18n.mergeLocaleMessages() 方法将这个语言包添加到 i18n 中，如下所示：

// main.js

import Vue from 'vue';
import VueI18n from 'vue-i18n';
import myLangPackage from './myLangPackage';

Vue.use(VueI18n);

const i18n = new VueI18n({
  locale: 'en',
  messages: {}
});

// Add locale messages dynamically
i18n.mergeLocaleMessages('en', myLangPackage.en);
i18n.mergeLocaleMessages('fr', myLangPackage.fr);

至此，我们已经完成了动态添加 store、路由和国际化配置的攻略。希望能对您有所帮助。