Git Product home page Git Product logo

vue-element-admin-express's Introduction

简介

vue-element-admin-express 是一个后台前端解决方案,它基于 vueelement-ui以及express实现。它使用了最新的前端技术栈,内置了动态路由,权限验证,并提供了简单的后端API服务,开箱即用,帮助你快速构建前后端分离动态路由和权限模型。

本项目通过vue-element-admin精简改造,移除了大部分组件,如需要其他组件,可前往搬运。

前序准备

你需要在本地安装 nodegitmysql。本项目技术栈基于 ES2015+vuevuexvue-routervue-cliaxioselement-uiexpress,提前了解和学习这些知识会对使用本项目有很大的帮助。

功能

- 登录 / 注销

- 系统管理
  - 用户管理
  - 菜单管理
  - 角色管理
  - 登录日志

服务端

# 进入server端目录
cd vue-element-admin-express/server

# 安装依赖
npm install

# 建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# vue-element-admin-express/server/mysql.sql 导入数据表到mysql数据库
# vue-element-admin-express/server/model/init.js 配置数据库信息:数据库名,登录账号,登录密码,ip,端口

# 启动 默认绑定ip:0.0.0.0 端口:8002, 可以在app.js指定你需要的ip和端口
npm run start

接口地址:http://0.0.0.0:8002

服务端 -聊天室

需要具备golang运行环境和相关知识。

cd ./server_chat/src/chat
go build -o "chat.exe"
chat.exe

如果不需要聊天室,可以移除Chat.vue相关涉及文件,可达到移除聊天室。

前台

# 克隆项目
git clone https://github.com/bigfool-cn/vue-element-admin-express.git

# 进入项目目录
cd vue-element-admin-express

# 安装依赖
npm install

# 建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run dev

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

发布

# 构建测试环境
npm run build:stage

# 构建生产环境
npm run build:prod

docker构建

根目录下的Dockerfile将服务端和客户端打包到了一个镜像,客户端打包后的dist目录放到服务端express内作为静态文件目录, 借用node的http服务就可以启动客户端了,需要修改VUE_APP_BASE_API为"/"。

# 构建镜像
docker build -t vue-element-admin-express .

# 启动一个项目容器
docker run -it -p 8002:8002 vue-element-admin-express

浏览器访问 http://ip:8002就可以访问了

PS: 在线示例跑在改Dockerfile构建的容器中

其它

# 预览发布环境效果
npm run preview

# 预览发布环境效果 + 静态资源分析
npm run preview -- --report

# 代码格式检查
npm run lint

# 代码格式检查并自动修复
npm run lint -- --fix

打赏

如果你觉得这个项目帮助到了你,你可以请作者吃一杯冰阔乐表示鼓励🍹: 打赏

支持浏览器版本

Modern browsers and Internet Explorer 10+.

IE / Edge Firefox Chrome Safari
IE10, IE11, Edge last 2 versions last 2 versions last 2 versions

License

MIT

Copyright (c) 2020-present bigfool-cn

vue-element-admin-express's People

Contributors

bigfool-cn avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

vue-element-admin-express's Issues

服务端权限控制问题

直接PSOTMAN访问接口地址呢?即使我有这个token,但是没有这个权限,是不是也可以查看相应的数据?前端页面控制了,服务端接口不用做权限校验控制?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.