大型Vue应用插件架构（二）

先看看Vue提供什么集中管理的，比较重要的东西：

• router
• vuex
• 其他库如axios request

业务模块可以通过下面的几个项目，对路由和Vuex状态等进行扩展

• vmx-router
• vmx-vuex
• vmx-request

业务模块只需要提供"router"扩展，就可以自动添加到路由表中，
不需要通过修改代码来改整体路由配置。同样，当我们不需要这个业务模块时，
在启动模块中拿走便是，无需做其他代码调整。看看代码感受一下：

Github: https://github.com/kmtong/vmx-sample

— 在线执行 —

— 在线执行 (新Vue3版本) —

进去后浏览器显示这个界面，左侧菜单显示了两项：Home 和 Module1

代码解构

主项目入口main.js

// main app
import App from "./App.vue";

// extension modules
import Layout from "./layout/module.js";
import Home from "./home/module.js";
import Module1 from "./module1/module.js";

Vue.config.productionTip = false;

Vue.use(VueModx, {
   
  modules: [
    RouterModule,
    RequestModule,
    VuexModule,
    Layout,
    Home,
    Module1
    // add more modules
  ],
  config: {
   
    router: {
   
      routes: [],
      scrollBehavior: () => ({
    y: 0 }), // see https://router.vuejs.org/guide/advanced/scroll-behavior.html#async-scrolling
      mode: "hash" // default "history"
    }
  }
});

我们先试试把 Module1 去掉，看看会怎样？

// main app
import App from "./App.vue";

// extension modules
import Layout from "./layout/module.js";
import Home from "./home/modul