0.1.5 • Published 5 months ago
ndedit v0.1.5
maotu-webtopo
基于 vue3 的 web 组态引擎库
探索将已有 svg 文件转为自由缩放图形库的解决方案,也可用作低代码大屏项目开发
说明
此开源版本的代码源自于 maotu 插件版 0.3.1 版本,与插件版的差异请查阅插件版的 readme。
使用文档
声明
maotu-webtopo
使用了 LGPL-3.0
协议。这意味着:
- 您可以将
maotu-webtopo
作为库链接到您的商业项目,而无需开源您的整个项目。 - 如果您修改了
maotu-webtopo
的核心库代码,并分发了修改后的版本,您必须按照 LGPL-3.0 协议的要求,开源您所做的修改。 如果您仅仅是将
maotu-webtopo
作为库链接到你的项目,而没有修改或分发它的源代码,那么你的项目无需开源。详细的 LGPL-3.0 许可证文本请查阅 https://www.gnu.org/licenses/lgpl-3.0.html。
如何构建插件并使用
构建库:
- 使用
pnpm run lib
命令构建maotu-webtopo
,生成dist
文件夹。
使用库:
推荐使用 pnpm 安装:
pnpm i maotu # 前提是你已经发布到了 npm
如果选择手动复制,请继续参考以下步骤
将
dist
文件夹中的以下文件复制到你的项目:dist/maotu.es.js
:库的入口文件。dist/style.css
:库的样式文件。dist/src
: 库的ts类型定义。- 将这些文件放到你项目中的合适位置。例如,你可以创建一个
src/lib/maotu
目录,并将它们复制到这里。
确保你的项目可以访问到
style.css
文件。可以通过在入口文件或组件中引入的方式来实现。
在项目中使用示例:
<script setup lang="ts">
import { MtEdit } from "@/lib/maotu/maotu.es" // 替换为你的实际路径
import "@/lib/maotu/style.css" // 替换为你的实际路径
</script>
<template>
<div class="w-1/1 h-100vh">
<mt-edit ref="NdEditRef" />
</div>
</template>
<style scoped></style>
鸣谢
maotu的部分逻辑实现参考了以下大佬的文章