preface

Uni-simple-router is a routing manager designed for UniApp. It is a router designed for uniapp. It is a router designed for uniapp.

1. Run the NPM command to download the file

npm install uni-simple-router
Copy the code

2. Initialize the installation

npm install uni-read-pages
Copy the code

3. Create a vue.config.js file in the root directory of the project

//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 ) }) ] } }Copy the code

4. Create the router.js file in the root directory and configure the route guard

// router.js import {RouterMount,createRouter} from 'uni-simple-router'; const router = createRouter({ platform: process.env.VUE_APP_PLATFORM, routes: [...ROUTES] }); // Global route front-guard router. BeforeEach ((to, from, next) => {console.log(to,form,next)}); Router.aftereach ((to, from) => {}) export {router, RouterMount}Copy the code

5. Add router.js to main.js

Import {router,RouterMount} from './router.js' // change path to own vue. use(router)Copy the code

6. Possible problems

1. You need to give a return when the routing guard is judging, otherwise it may cause stack overflow.

If (judge condition) return next()Copy the code

2. If you have introduced createRouter and RouterMount to router.js, but still fail to do so, you may have a problem with the version number you downloaded

This is xiaobian introduced version you can refer to, thank you for xiaobian support.