Avue is a backend integration solution supporting SSR (Server Side Rendering) and SPA (Singleton Pages),

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

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325266917&siteId=291194637