How to realize Front and back end Separation based on vue-element-admin
This article introduces the relevant knowledge of "how to achieve front-end separation based on vue-element-admin". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!
Brief introduction
This project skeleton-admin is based on vue-element-admin 's front-end and front-end separate back-end projects. The back-end project skeleton is a basic background skeleton system done by hyperf with user management, rights management, role management, menu management, rights verification, and user authentication (jwt). Therefore, this project skeleton-admin needs to be used together with skeleton to be more appropriate.
Pre-order preparation
You need to install node and git locally. The technical stack of this project is based on ES2015+, vue, vuex, vue-router, vue-cli, axios and element-ui. All the request data are simulated by Mock.js. Knowing and learning these knowledge in advance will be of great help to the use of this project.
Features-login / logout-permissions add-permission deletion-permission modification-role authorization-role add-role deletion-role modification-user role-user management-user deletion-user information modification-user password modification-menu- Menu add-menu deletion-menu modification-role menu-token login authentication-Multi-environment publishing-dev-sit-stage-prod feature preview
Development # Clone project git clone https://github.com/anziguoer/skeleton-admin.git# enters the project directory cd skeleton-admin# installation depends on npm install# it is recommended not to use cnpm installation dependency directly, there will be all kinds of weird bug. The slow download speed of npm can be solved by doing the following: npm install-- registry= https://registry.npm.taobao.org# edits the backend interface address: .env.development / base apiVUE_APP_BASE_API = 'http://localhost:9501/backend'# startup service npm run dev
Browsers access http://localhost:9527
Initial account password account: admin@admin.com password: admin123 release # build test environment npm run build:stage# build production environment npm run build:prod other # Preview release environment effect npm run preview# Preview release environment effect + static resource analysis npm run preview-report# code format check npm run lint# code format check and automatic repair npm run lint-fix This is the end of the introduction to "how to achieve front-end separation based on vue-element-admin". Thank you for your reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!