uni-simple-router使用

一.安装路由：

npm install uni-simple-router
npm install uni-read-pages

 

二.配置路由：

1.根目录新建router.js：

// router.js
import {RouterMount,createRouter} from 'uni-simple-router';

const router = createRouter({
    platform: process.env.VUE_APP_PLATFORM,  
    routes: [...ROUTES]
});
//全局路由前置守卫
router.beforeEach((to, from, next) => {
    next();
});
// 全局路由后置守卫
router.afterEach((to, from) => {
    console.log('跳转结束')
})

export {
    router,
    RouterMount
}

2.配置main.js

// main.js

import Vue from 'vue'
import App from './App'
import {router,RouterMount} from '@/router.js'
Vue.use(router)

App.mpType = 'app'
const app = new Vue({
    ...App
})

RouterMount(app,router,'#app')
app.$mount(); 

3.配置vue.config.js

//vue.config.js
const TransformPages = require('uni-read-pages')
const {webpack} = new TransformPages()
module.exports = {
    configureWebpack: {
        plugins: [
            new webpack.DefinePlugin({
                ROUTES: webpack.DefinePlugin.runtimeValue(() => {
                    const tfPages = new TransformPages({
                        includes: ['path', 'name', 'aliasPath']
                    });
                    return JSON.stringify(tfPages.routes)
                }, true )
            })
        ]
    }
}

 三、注意事项

1、报错：Cannot read properties of null (reading 'replace')

在main.js里的

Vue.use(router)
要放在

const app = new Vue({
    ...App
})
之前