代码拉取完成,页面将自动刷新
magicalcoder可视化布局器是一款可集成jquery,vue,react框架的ui进行可视化开发配置的在线h5工具,现被大家广泛应用于企业项目中,解决可视化场景的业务 在线体验:index-element.html 顶部ui可切换其他UI
与vue所不同的是,magicalcoder采用原生js开发,所以就需要vue的项目打包成一个js以<script></script>方式引入布局器集成进来
本实例参考了yyl-npm-practice 并且在其基础上进行了修改,主要是修复了 模块化与打包后的体验一致性问题
安装方法:
1.npm安装:
npm:
cd vue-magicalcoder-demo
#安装
npm install
#以下2行代码视情况而定 如果出现sass-loader报错 请执行下面2行代码 否则请忽略
npm i sass-loader -D
npm i node-sass -D
#运行
npm run dev
ps:如果嫌慢
可以用国内镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install
cmpn run dev
cnpm run build
2. 原始vue开发方式 可以参考App.vue的引用方式
3.CDN的开发方式 引用vue-magicalcoder-demo.js
#打包
如果您新增了组件 请先配置index.js内
npm run build
双击 test.html即可预览
4 集成布局器 vip-3.0-try 布局器目录
里面集成了vue-magicalcoder-demo.js的组件引用 访问 index-element.html 即可查看效果 windows也可以直接双击vip-3.0-try/启动.bat来预览布局器效果
注意:
如果有新修改,请把dist/vue-magicalcoder-demo.js 拷贝到vip-3.0-try/html/magicalcoder/assets/drag/ui/myvue/下
这样布局器才能识别到
5 还有疑问 请联系QQ:799374340 欢迎前来交流
关于分支解释 一个分支代表一个场景的组件封装,这种方式代码最小化 有利于您阅读代码
master:最简单的分支
mc-form:一个el-form的封装,能自动识别内部有哪些基础组件,然后获取绑定的v-model组装成一个入参,提交到后台
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。