Here’s the problem. Contact vue-Router, normal process is ok. Vue -router ff.js

/* eslint-disable */
import Vue from "vue";
import VueRouter from "vue-router"; VueRouter vue. Use (vueRouter); class Ff { constructor(options) { const matcher = createMatcher(options.routes || [])return this.router = new VueRouter({
            matcher
        })
    }
    push(options) {
        this.router.push(options)
    }
}

function createMatcher() {
    const home = () => import(".. /components/HelloWorld.vue");
    const Page1 = () => import(".. /components/Page1.vue");
    const Page2 = () => import(".. /components/Page2.vue");
    const Page3 = () => import(".. /components/Page3.vue");
    const Page1A = () => import(".. /components/Page1-a.vue");
    const Page1B = () => import(".. /components/Page1-b.vue");
    const Page1C = () => import(".. /components/Page1-c.vue");
    return [
        {
            path: "/home",
            component: home
        },
        {
            path: "/page1",
            component: Page1,
            children: [
                {
                    path: "Page1A",
                    component: Page1A
                },
                {
                    path: "Page1B",
                    component: Page1B
                },
                {
                    path: "Page1C", component: Page1C}, // When entering home, the following components display the default display page {path:"",
                    component: Page1A
                }
            ]
        },
        {
            path: "/page2", Component: Page2}, /* Add user path with dynamic id*/ {path:"/Page3/:id",
            name: 'page3', Component: Page3}, // Redirect to open the page by default {path:'/',
            redirect: '/home'}}]export default Ff;
Copy the code

Throw the produced object to main.js index2.js as well

/* eslint-disable */

import routes from './router.config';
import Ff from './Ff';

var ff= new Ff({
    routes
})
debugger
export default ff;
Copy the code

Main.js is used to use main.js

/* eslint-disable */
import Vue from 'vue'
import App from './App.vue'// Import router from"./router/index2"

Vue.config.productionTip = false
debugger
new Vue({
  render: h => h(App),
  router
}).$mount('#app')
Copy the code

But the page did not render the effect, the routing information should not run in. What is the reason?