BlockUI for vue 2 can be used for loading screen

by Vue.js Examples

vue-blockui

BlockUI for vue 2, similiar to jquery blockUI, can be used for loading screen.

Installation

npm install --save vue-blockui

Use Component

Install all the components:

import Vue from 'vue'
import BlockUI from 'vue-blockui'

Vue.use(BlockUI)

**
⚠️ If You see some errors during webpack compilation, you might be missing the right configuration for loading css in your webpack.config.js.
**

Under "rules", you should have below configuration:

    {
        test: /\.css$/,
        use: [ 'style-loader', 'css-loader' ]
    }
  • Be aware that you should have configured style-loader and css-loader in your package.json to support above rule.
npm install style-loader css-loader --save-dev

GitHub