Avue引入项目

一. 介绍
Avue 是一个基于Element框架 (opens new window)低代码前端框架，它使用 JSON 配置来生成页面，可以减少页面开发工作量，极大提升效率

官网：介绍 | Avue

二. 引入

1. 首先他是基于 elementUI 的二次开发，所以首先我们需要引入 elementUI

npm i element-ui -S

1. 需要引入 axios

npm i axios -S

1. 需要引入 http

npm i -S stream-http

1. 在引入 Avue

npm i @smallwei/avue@latest-v2 -S

1. 在 main.js 当中

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import Avue from '@smallwei/avue';
import '@smallwei/avue/lib/index.css';
Vue.use(ElementUI);
Vue.use(Avue, {
size: 'small',
crudOption: {},
formOption: {},
tableSize: '',
formSize: '',
appendToBody: true,
modalAppendToBody: true,
cos: {},
qiniu: {},
ali: {},
canvas: {},
});

1. 在 vue.config.js 当中

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
publicPath: "./",

configureWebpack() {
return {
resolve: {
fallback: {
http: require.resolve("stream-http"),
},
},
}
},
})
这样我们的 Avue 就算引入成功了

页面里写上

效果