@bassist/progress

Simple slim progress bars base on NProgress.

Usage

With npm(or yarn, or pnpm):

``bash
npm install @bassist/progress
`

In .js / .ts or other files:

`ts
import progress from '@bassist/progress'

// Used in the framework's router hooks.
// Or in other scenarios (e.g. AJAX requests).

router.beforeEach(() => {
progress.start()
})

router.afterEach(() => {
progress.done()
})
`

All configurations and options of NProgress are supported.

Set Color

This plugin extends NProgress's API and adds a setColor method.

- Type Declarations:

`ts
export interface Progress extends NProgress {
/**
*
* @param color - A valid CSS color value or CSS variable
*
* @example use HEX
* progress.setColor('#ff0000')
*
* @example use RGB
* progress.setColor('rgb(255, 0, 0)')
*
* @example use RGBA
* progress.setColor('rgba(255, 0, 0, 1)')
*
* @example use CSS Variable
* progress.setColor('var(--color-primary)')
*/
setColor: (color: string) => void
}
`

- Example:

`ts
import progress from '@bassist/progress'

// Set the color before start
progress.setColor('#ff0000')

// Then, used in the framework's router hooks.
// Or in other scenarios (e.g. AJAX requests).

router.beforeEach(() => {
progress.start()
})

router.afterEach(() => {
progress.done()
})
``

Release Notes

Please refer to CHANGELOG for details.

License

MIT License © 2022-PRESENT chengpeiquan