README.md 2.56 KB

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.

字体图标Font Awesome

点击在浏览器中选择使用Font Awesome字体图标

插件应用

打包生成 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.项目准备