This Package is out of Date and not maintained anymore !

All of the Features are now available in unplugin-vue-router

vue-router-utils

Vue Router 4 Utilities

Features

• Route Name Inheritance
• Prefixing Children Routes
• Meta Inheritance
• Disable Pathrooting
• Sort Routes Alphabetically with Errors always at the End

Usage

Install

npm i vue-router-utils -D

Getting Started

RouterUtilities will output a Vue Router 4 compatible Routes Array. Just the specific Changes from the Utilities will be applied.

import { RouterUtilites } from 'vue-router-utils';

export const routes = new RouterUtilities([
	{
		path: '/'
		name: 'home'
	}
]);

Changes

In the following you will see some Changes that get applied from RouterUtilities to a normal Routes Array.

Before:

[
	{
		path: '/auth',
		name: 'auth',
		children: [
			{
				path: '',
				name: 'login'
			},
			{
				path: '/register',
				name: 'register'
			}
		]
	},
	{
		path: '/:pathMatch(.*)*',
		name: 'error',
	},
	{
		prefix: '/u/:user',
		meta: {
			isAuthenticated: false
		},
		children: [
			{
				path: '/profile',
				name: 'profile'
			},
			{
				path: '/stats',
				name: 'stats'
			}
		]
	},
	{
		path: '/:location_id',
		children: [
			{
				path: '',
				name: 'info'
			}
		]
	}
]

After [ + sorted asc with errors at the end ]:

[
	{
		path: '/auth',
		name: 'auth',
		children: [
			{
				path: '',
				name: 'auth:login'
			},
			{
				path: 'register',
				name: 'auth:register'
			}
		]
	},
	{
		path: '/:location_id',
		children: [
			{
				path: '',
				name: 'location:info'
			}
		]
	},
	{
		path: '/u/:user/profile',
		name: 'user:profile',
		meta: {
			isAuthenticated: false
		},
	},
	{
		path: '/u/:user/stats',
		name: 'user:stats',
		meta: {
			isAuthenticated: false
		},
	},
	{
		path: '/:pathMatch(.*)*',
		name: 'error',
	},
]