Please consider starring the project to show your ❤️ and support.

Introduction

Webpack terminal information to browser.

This plugin is recommended for webpack-based app bundler.

Install

yarn add loading-screen -D

Using poi? Go poi-plugin-loading-screen

Usage

In your webpack.config.js:

const LoadingScreenPlugin = require('loading-screen')

module.exports = {
  plugins: [new LoadingScreenPlugin()]
}

API

new LoadingScreenPlugin(options)

host

• Type: string
• Default: 'localhost'

The loading screen server host.

P.S. CANNOT be the same as the app server host.

port

• Type: number
• Default: process.env.port || 4000

The loading screen server port.

callback

• Type: (req, res) => void
• DefaultBehavior: Print loading screen server message.

The loading screen server callback.

baseURL

• Type: string
• Default: '/'

Similiar with webpack.output.publicPath.

logo

• Type: url | HTML.innerHTML
• Default: 'https://webpack.js.org/assets/icon-square-big.svg' which mean is webpack logo

Set url to display your prefer logo for loading screen.

Or with regular HTML:

new LoadingScreenPlugin({
  logo: '<div>my logo</div>'
})

theme

• Type: ThemeConfig
• Default: DefaultThemeConfig

Customize loading screen progress bar color.

interface ThemeConfig {
  client?: string
  server?: string
  modern?: string
}

const DefaultThemeConfig = {
  client: '#8ed5fb',
  server: '#1b78bf',
  modern: '#2f495e'
}

env

• Type: 'development' | 'production'
• Default: process.env.NODE_ENV

Enable loading screen when is 'development', disable otherwise.

handler

• Type: (per, message, ...details) => void

Progress hooks report details.

Reference: https://webpack.js.org/plugins/progress-plugin/

showPercent

• Type: boolean
• Default: true

Credits

• nuxt/loading-screen

Contributing

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -am 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request :D

Author

loading-screen © EVILLT, Released under the MIT License.

Authored and maintained by EVILLT with help from contributors (list).

evila.me · GitHub @evillt · Twitter @evillt