效果图：

一、安装：

npm install vue-particles --save

二、引入 main.js 文件：

import VueParticles from 'vue-particles'  
Vue.use(VueParticles)

三、使用：

    <vue-particles
      class="login-background"
      color="#409EFF"
      :particleOpacity="0.7"
      :particlesNumber="60"
      shapeType="circle"
      :particleSize="6"
      linesColor="#409EFF"
      :linesWidth="1"
      :lineLinked="true"
      :lineOpacity="0.4"
      :linesDistance="150"
      :moveSpeed="3"
      :hoverEffect="true"
      hoverMode="grab"
      :clickEffect="true"
      clickMode="push">
    </vue-particles>

.login-background {//可设置背景图 铺满屏
  background: linear-gradient(-180deg, #dceaf2 0%, #ffffff 100%);
  width: 100%;
  height: 100%;
  position: absolute;
}

四、属性说明：

属性	类型	说明
color	String	粒子颜色（默认：#dedede）
particleOpacity	Number	粒子透明度（默认：0.7）
particlesNumber	Number	粒子数量（默认：80）
shapeType	String	粒子外观类型（默认：circle，全部：circle，edge，triangle，polygon，star）
particleSize	Number	单个粒子大小（默认：80）
linesColor	String	线条颜色（默认：#dedede）
linesWidth	Number	线条宽度（默认：1）
lineLinked	Boolean	连接线是否可用（默认：true）
lineOpacity	Number	线条透明度（默认：0.4）
linesDistance	Number	线条距离（默认：150）
moveSpeed	Number	粒子运动速度（默认：3）
hoverEffect	Boolean	是否有hover特效（默认：true）
hoverMode	String	hover模式类型（grab，repulse，bubble）
clickEffect	Boolean	是否有click特效（默认：true）
clickMode	String	click模式类型（push，remove，repulse，bubble）