vue-admin-template(项目模板)

template-front
├── public
│   ├── img -- 放置项目中的图片
│   ├── config.js -- 项目环境配置（服务器base url等），未使用vue cli的多环境配置文件(.env.development等)因为这种方式修改baseUrl必须重新打包
│   └── 其他文件夹 -- 为vue自带文件不做介绍
├── src
│   ├── components -- 放置项目公用组件
│   │   ├── VmSearch.vue -- 搜索框组件
│   │   └── VmTable.vue -- 表格封装，包含分页、搜索、搜索条件重置、网络请求等
│   ├── plugins -- 放置插件
│   │   ├── el-dialog-drag.js -- 此指令加在el-dialog上可实现dialog拖曳
│   │   ├── axios.js -- axios配置文件，token、全局网络请求错误提示、401跳转到登录页 均在此配置
│   │   ├── element.js -- 引入element ui
│   │   ├── http.js -- 在axios基础上增加的一层封装，简写网络请求，适合restfull风格的接口，挂在到全局
│   │   └── myPlugin.js -- 全局指令、方法挂载、全局异常处理
│   ├── router -- 路由
│   │   ├── router.js -- 路由配置文件
│   │   └── routerBuilder.js -- 路由生成工具类，也可不适用此工具类按照原有语法书写路由
│   ├── store -- vue状态管理
│   ├── style -- 全局css配置
│   │   ├── element.scss -- 覆写element ui的样式，例如圆角、主题色、表格边框等
│   │   ├── main.scss -- 项目全局css，放置公用css
│   │   ├── transition.scss -- 项目全局css动画
│   │   └── variables.scss -- css变量
│   ├── util -- 工具
│   │   ├── constant.js -- 放置静态变量、文本对照。可直接转化为el-select使用的数据格式.使用方式参照DeviceList.vue和DeviceEdit.vue
│   │   ├── loginUtil.js -- 登录返回数据保存和获取，token、用户名、权限等
│   │   └── regular.js -- 常用的正则表达式，校验用户名、密码等
│   └── 其他文件夹 -- 为vue自带文件不做介绍
│   ├── views -- 页面
│   │   ├── main -- 放置登录、主页、侧边栏等等
│   │   └── 其他文件夹  -- 放置自己的项目模块
│   └── 其他文件夹 -- 为vue自带文件不做介绍
├── .gitignore -- git忽略dist、node_modules、ide配置文件等
├── .npmrc -- 此文件npm会自动读取，无需改动。更改npm源，防止node-sass等安装失败
├── alias.config.js -- 编辑器无法识别vue的@符号路径，无法跳转。Intellij idea或者WebStorm中搜索webpack选中此文件，可使编辑器识别到@路径。如果无需跳转，可删除
├── Dockerfile -- 用docker的人懂得，不用的可删除此文件。
├── nginx.conf -- Dockerfile中使用此文件作为nginx配置文件(原版配置文件，只改动启用了gzip)。不使用docker和nginx部署的请忽略
└── 其他文件 -- 为vue cli自带文件不做介绍

# clone或者下载项目

# 修改服务器地址`public/config.js`,可直接连接"http://118.25.44.86:8010/"进行测试
# 进入项目目录
cd template-front

# 安装依赖
npm install

# 启动项目
npm run serve

#进入项目根目录
cd template-front

#打包项目
npm run build

#docker打包镜像
docker build -t template-front:latest .

#启动docker容器,可使用-e SPRING_PROFILES_ACTIVE=${env}指定环境，不指定则默认为dev
docker run -itd --name template-front -e env=dev template-front:latest

#进入项目根目录
cd template-front

#打包项目
npm run build

#将dist目录拷贝至任意web容器即可，tomcat、jetty、nginx、IIS均可