/vue-portal-webUI

基于Vue的门户网站小组件

Primary LanguageCSS

vue-portal-webUI

基于Vue的门户网站UI组件

目前更新的有:

P1.新闻选项卡滑动
P2.平滑放大效果
P3.轮播图
P4.检索即时过滤功能
P5.爱心点赞
P6.粒子动效
P7.滚动新闻

(持续更新中...)

在线查看效果

点击进入

构建和设置

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# run all tests
npm test

项目目录结构

├── README.md                    项目介绍
├── index.html                   入口页面
├── build                        构建脚本目录
│  ├── build-server.js           运行本地构建服务器,可以访问构建后的页面
│  ├── build.js                  生产环境构建脚本
│  ├── dev-client.js             开发服务器热重载脚本,主要用来实现开发阶段的页面自动刷新
│  ├── dev-server.js             运行本地开发服务器
│  ├── utils.js                  构建相关工具方法
│  ├── webpack.base.conf.js      wabpack基础配置
│  ├── webpack.dev.conf.js       wabpack开发环境配置
│  └── webpack.prod.conf.js      wabpack生产环境配置
├── config                      项目配置
│  ├── dev.env.js               开发环境变量
│  ├── index.js                 项目配置文件
│  ├── prod.env.js              生产环境变量
│  └── test.env.js              测试环境变量
├── package.json                npm包配置文件,里面定义了项目的npm脚本,依赖包等信息
├── src                         源码目录  
│  ├── main.js                 入口js文件
│  ├── app.vue                 根组件
│  ├── components              公共组件目录
│  │ 
│  ├── assets                  资源目录,这里的资源会被wabpack构建
│  │  └── images
│  │    └── logo.png
│  ├── routes                 前端路由
│  │  └── index.js
│  ├── mock                   mock数据目录
│  │  └── mock.js
│  └── pages                 页面目录
│    ├── index               首页
│    └── pi..               具体模块页
├── static                  纯静态资源,不会被wabpack构建。