https://gitee.com/smallweigit/avue.git
Vue is just getting started, many functions are still under development, so stay tuned...
Simplified Chinese welcome to join the QQ exchange group and learn from each other.
One-click to join the group:
Introduction
avue
is a backend integration solution that supports SSR (Server Side Rendering) and SPA (Singleton Pages), it is based on Vue.js and element . It uses the latest front-end technology stack, permission verification, third-party website nesting and other functions, many functions are still under development, please look forward to the
1.vuex本地持久化存储,封装h5的sessionStorage和localStorage
2.加入了本地离线的包引入方法去引入vue,vue-router等第三方包
detailed introduction of vue
3.支持SSR服务端渲染(express)
-server-renderer
4.支持阿里巴巴图标库在线调用,自动同步图标
Alibaba icon library
5.支持iframe嵌套第三方网站
6.支持js动态可配CRUD,节约大量开发成本
7.支持多种登录方式
8.全局错误日志记录
Log in
error logging
CRUD
Alibaba icon library (online call)
Login page SSR rendering
Home
third party website
Function
- Global error logging - vuex persistent storage - SSR rendering page - login/logout - Username login - Verification code login - Third party login (in development) - ASD - 3rd party website nesting - CRUD (add, delete, modify, search) - Alibaba icon library (online call) - More functions are under development
Global error logging
Release the errorA component in ./src/page/errlog/index.vue to test that it is stored locally, you can return the method to upload the server yourself, and call the CLEAR_ALL_ERR method to clear the local
Please see the vuex persistent storage demo
For detailed demo, please see ./src/store/modules/tgs.js example
... state:{ ... tag: getStore({ name: 'tag' }) || tagObj }, ... mutations: { ... setStore({ name: 'tagList', content: state.tagList, type: 'session' }) ... }
CRUD usage instructions —— Automatically generate CRUD according to the configuration json file
For detailed demo, please see ./src/page/table/index.vue instance
{ border: true,//Whether the table displays the border index: true,///Whether the table displays the serial number selection: true,//Whether the table displays optional selection column: [ { label: "Username",//Title of the table prop: "username",//key of the table width: "150",//the width of the table fixed: true,//Whether to freeze the column type:'select', //select | radio | checkbox defaults to text hidden: true,//Exceed the ellipsis display dicData: [ { label: "男", value: 0 }, { label: "女", value: 1 } ],//type data dictionary, when type is: select | radio | checkbox loaded dataDetail: val => { return `<span class="el-tag">${val}</span>`;;//Whether to process the list data }, rules: [{ required: true, message: "Please enter your username", trigger: "blur" }] //Form validation rules } }
develop
# clone project https://gitee.com/smallweigit/avue.git # install dependencies npm install # It is recommended not to install with cnpm, there will be all kinds of weird bugs, you can solve the problem of slow npm download speed by the following operations npm install --registry=https://registry.npm.taobao.org # start the service npm run dev
Debug and Release
# Build test environment npm run dev # Build the build environment npm run build # Build SSR rendering page npm run start
other
# code detection npm run lint # unit test above sea level run karma # Build the SSR client code npm run build:client # Build the SSR server-side code npm run build:server