分类:VUE模板

cloud-platform-uivue3element-uiwebpack

作者:geek_qi 开源协议:Apache License 2.0


Cloud-Platform

准备工作

  • node.js环境(npm包管理器)
  • vue-cli 脚手架构建工具
  • cnpm npm的淘宝镜像

开发运行

 # 安装依赖 npm install    //or # 建议不要用cnpm  安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题 npm install --registry=https://registry.npm.taobao.org # 本地开发 开启服务 npm run dev

浏览器访问http://localhost:9527

发布

 # 发布测试环境 带webpack ananalyzer npm run build:sit-preview # 构建生成环境 npm run build:prod

部署nginx配置参考

 location / { # 指向我们打包后上传的前端文件 root /opt/nginx/dist; index index.html; } location /jwt/ { # 转发请求到后端服务网关 proxy_pass http://127.0.0.1:8765/jwt/; } location /api/ { proxy_pass http://127.0.0.1:8765/api/; }

目录结构

├── build // 构建相关  ├── config // 配置相关├── src // 源代码│   ├── api // 所有请求│   ├── assets // 主题 字体等静态资源│   ├── components // 全局公用组件│   ├── directive // 全局指令│   ├── filtres // 全局filter│   ├── mock // mock数据│   ├── router // 路由│   ├── store // 全局store管理│   ├── styles // 全局样式│   ├── utils // 全局公用方法│   ├── view // view│   ├── App.vue // 入口页面│   └── main.js // 入口 加载组件 初始化等├── static // 第三方不打包资源│   ├── jquery│   └── Tinymce // 富文本├── .babelrc // babel-loader 配置├── eslintrc.js // eslint 配置项├── .gitignore // git 忽略项├── favicon.ico // favicon图标├── index.html // html模板└── package.json // package.json

状态管理

后台只有user和app配置相关状态使用vuex存在全局,其它数据都由每个业务页面自己管理。

感谢

感谢作者:PanJiaChen

License

Apache License Version 2.0