English | 简体中文

Special thanks

This Project was simplified based on vue-element-admin.The all-future front-end solutions, please check vue-element-admin github.

Introduction

vae-li-template is based on vue-element-admin modified streamlined background template.It keepsvue-element-adminbased framework, at the same time deleted most of components and auxiliary functions. Reduce the cost of setting up the framework in the early stage of the background project development. All-future background framework integration scheme, although the function is very powerful, but in many cases most of the function is redundant. If you want a lean, yet not too crude, backend project to use as a foundation for development, this project will help you.

Preparation

First need to understand vue-element-admin, it's very detailed documentation. Please read it first.

The most part of technology stack is as same as vue-element-admin's technology stack： The local environment: node and git. Main technology stack: ES2015+、vue、vuex、vue-router 、vue-cli 、axios and element-ui

Major modifications from Vue Element Admin

Tags：
[-] Delete
[+] New
[.] reserved part
[!] modified

- Build tools
 - [!] Mock - Keep only the user logged in and out apis
  - [!] edit user login response data
 - [-] plop - Microgenerator framework (code generation tool)
 - [-] the environment files of production environment and other environments
 - [+] add vuex-persistedstate

- Projects
 - [-] Role management module
 - [-] Dynamic routing

 - [!] User Login
  - [-] Delete third party login
  - [-] Deletes user role judgment
  - [!] edit user login router guard

 - [!] Page layout
  - [.] Only the full-screen function button is retained

 - [!] The left side menu
  - [.] Keep only the [Dashboard] page

 - [!] Other pages
  - [.] Keep the 401 and 404 error pages
  - [.] Save the [Profile] page
  - [.] Retains the redirect page
  - [.] Retains the login page

Description of modification

• Modification of build tools
  • For example, the deletion of PLOP and other tools can be added as needed in the later stage without affecting the basic framework, so it will be deleted
• Project section
  • Role management and dynamic routing depend on the definition of permissions and roles in each project interface, which can hardly meet the actual development needs, so they are removed
• Page function section
  • Only some error pages are kept, and other feature demo pages are deleted. Similarly, component functionality needs to be adapted to the actual development needs and should not be used as base template content
  • Keep the page header breadcrumbs
• User login process adjustment
  • Replace user roles with Permission to obtain user information after login and obtain corresponding permissions for the user. Determines the menu that the user can access based on the user's permissions
  • Added vuex-persistedState to optionally persist part of the store

Getting started

# clone the project
git clone https://github.com/omretterry/vea-li-template.git

# enter the project directory
cd vea-li-tempalte

# install dependencies
npm install

# develop
npm run dev

This will automatically open http://localhost:9999

Build

# Build for production environment
npm run build

Advanced

# preview the release environment effect
npm run preview

# preview the release environment effect + static resource analysis
npm run preview -- --report

# code format check
npm run lint

# code format check and auto fix
npm run lint:fix

Changelog

Detailed changes for each release are documented in the release notes.

Browsers support

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) 2021-present Terryli