# Vue cli 3 项目脚手架 (已配置好环境变量，axios，引入了字体图标 Font Awesome， 若有其他开发需要请自行添加)

## Project setup  安装依赖
```
npm install
```
### Compiles and hot-reloads for development    启动项目
```
npm run serve   //默认开发环境.env文件
npm run serve-prod  //生产环境.env.prod文件
```
### Compiles and minifies for production  打包环境
```
npm run build   //默认开发环境.env文件
npm run build-prod  //生产环境.env.prod文件
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).

## 字体图标Font Awesome
点击在浏览器中选择使用[Font Awesome字体图标](http://fontawesome.dashgame.com/)

## 插件应用 

### 打包生成 ZIP 文件
```
1、安装插件 npm install filemanager-webpack-plugin --save-dev
2、vue.config.js配置文件

  const FileManagerPlugin = require('filemanager-webpack-plugin');

  module.exports = {
    configureWebpack: { // webpack 配置,避免缓存js
      plugins: [
        new FileManagerPlugin({  //初始化 filemanager-webpack-plugin 插件实例
          onEnd: {
            mkdir: ['./dist'],
            archive: [ //然后我们选择dist文件夹将之打包成dist.zip并放在根目录
              {source: './dist', destination: './dist/dist.zip'},   
            ]
          }
        })
      ]
    },
  }
```
## 工程目录
```
./dist         //打包生成文件存放地址
./public       //公共文件
./src          //主目录
  |-api
    |-common    //公共接口
    |-config    //请求相关配置
    |-user    //用户相关接口
    |-zd    //宗地相关接口
    |-zrz    //自然幢相关接口
  |-assets     //静态资源
  |-components //封装组件
  |-views      //view页面组件总地址
    |-login    //登录模块
    |-mixin    //混入组件
    |-panel    //导航模块
    |-systemDZ    //多幢
    |-systemH    //户
    |-systemZD    //宗地
    |-systemZRZ    //自然幢
  |-App.vue    //页面入口vue组件
  |-main.js    //项目入口js文件
  |-router.js  //前端路由
  |-store.js   //vuex应用级数据（state）
./zip          //打zip包存放地址
.env           //默认开发环境配置
.env.prod      //生产环境配置
.eslintrc.js   //eslint是用来管理和检测js代码风格的工具，可以和编辑器搭配使用
.babel.config.js //预设可以作为babel插件的数组，甚至是一个可共享的选项配置。
.vue.config.js  //vue-cli3配置文件
...
```
### components 封装组件说明
 权籍系统整体框架的搭建
 1.项目准备