JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-04-05 19:41:40 +08:00
Code Issues Projects Releases Wiki Activity

build: 构建时某些文件的.d文件丢失

Browse Source
This commit is contained in:
roymondchen 2022-08-05 19:59:19 +08:00 committed by jia000
parent 9ffecf62f7
commit 5e36ca8e47
56 changed files with 919 additions and 1083 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.eslintignore
View File

@ -4,6 +4,7 @@ entry-dist
coverage
node_modules
dest
types
comp-entry.ts
config-entry.ts

1
.gitignore vendored
View File

@ -1,6 +1,7 @@
.DS_Store
node_modules
dist
types
.temp
.cache

2
magic-admin/web/tsconfig.json
View File

@ -15,7 +15,7 @@
"types": [
"webpack-env",
"jest",
"./types",
"./typings",
"node"
],
"paths": {

0
magic-admin/web/types/axios-jsonp/index.d.ts → magic-admin/web/typings/axios-jsonp/index.d.ts vendored
View File

0
magic-admin/web/types/index.d.ts → magic-admin/web/typings/index.d.ts vendored
View File

0
magic-admin/web/types/shims-vue.d.ts → magic-admin/web/typings/shims-vue.d.ts vendored
View File

2
package.json
View File

@ -5,7 +5,7 @@
"packageManager": "pnpm@7.1.9",
"scripts": {
"bootstrap": "pnpm i && pnpm build",
"clean:top": "rimraf */**/dist */**/admin-dist */**/entry-dist */dist coverage dwt*",
"clean:top": "rimraf */**/dist */**/types */**/admin-dist */**/entry-dist */dist coverage dwt*",
"clean:modules": "rimraf node_modules **/node_modules **/**/node_modules",
"clean:all": "pnpm clean:top && pnpm clean:modules",
"lint": "eslint . --ext .js,.vue,.ts,.tsx",

10
packages/core/package.json
View File

@ -6,7 +6,7 @@
],
"main": "dist/tmagic-core.umd.js",
"module": "dist/tmagic-core.mjs",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-core.mjs",
@ -20,7 +20,9 @@
},
"license": "Apache-2.0",
"scripts": {
"build": "vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -39,8 +41,8 @@
"devDependencies": {
"@types/events": "^3.0.0",
"@types/node": "^15.12.4",
"rimraf": "^3.0.2",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6"
"vite": "^3.0.4"
}
}

13
packages/core/tsconfig.build.json Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {},
},
"include": [
"src"
],
}

3
packages/core/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

11
packages/core/vite.config.ts
View File

@ -19,21 +19,10 @@
import path from 'path';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
import pkg from './package.json';
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
],
resolve: {
alias:
process.env.NODE_ENV === 'production'

10
packages/editor/package.json
View File

@ -8,7 +8,7 @@
"main": "dist/tmagic-editor.umd.js",
"module": "dist/tmagic-editor.mjs",
"style": "dist/style.css",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-editor.mjs",
@ -22,7 +22,9 @@
},
"license": "Apache-2.0",
"scripts": {
"build": "vue-tsc --noEmit && vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && vue-tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -73,10 +75,10 @@
"@vitejs/plugin-vue": "^3.0.1",
"@vue/compiler-sfc": "^3.2.37",
"@vue/test-utils": "^2.0.0",
"rimraf": "^3.0.2",
"sass": "^1.35.1",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6",
"vue-tsc": "^0.38.2"
"vue-tsc": "^0.39.4"
}
}

168
packages/editor/src/components/ContentMenu.vue
View File

@ -22,119 +22,107 @@
</div>
</template>
<script lang="ts">
import { defineComponent, nextTick, onMounted, onUnmounted, PropType, ref } from 'vue';
<script lang="ts" setup>
import { nextTick, onMounted, onUnmounted, ref } from 'vue';
import { MenuButton, MenuItem } from '@editor/type';
import ToolButton from './ToolButton.vue';
export default defineComponent({
components: { ToolButton },
props: {
menuData: {
type: Array as PropType<MenuItem[]>,
default: () => [],
},
isSubMenu: {
type: Boolean,
default: false,
},
const props = withDefaults(
defineProps<{
menuData?: MenuItem[];
isSubMenu?: boolean;
}>(),
{
menuData: () => [],
isSubMenu: false,
},
);
emits: ['hide', 'show'],
const emit = defineEmits(['hide', 'show']);
setup(props, { emit }) {
const menu = ref<HTMLDivElement>();
const subMenu = ref<any>();
const visible = ref(false);
const subMenuData = ref<MenuItem[]>([]);
const menuStyle = ref({
left: '0',
top: '0',
});
const menu = ref<HTMLDivElement>();
const subMenu = ref<any>();
const visible = ref(false);
const subMenuData = ref<MenuItem[]>([]);
const menuStyle = ref({
left: '0',
top: '0',
});
const hide = () => {
if (!visible.value) return;
const hide = () => {
if (!visible.value) return;
visible.value = false;
subMenu.value?.hide();
visible.value = false;
subMenu.value?.hide();
emit('hide');
};
emit('hide');
};
const hideHandler = (e: MouseEvent) => {
const target = e.target as HTMLElement | undefined;
if (!visible.value || !target) {
return;
const hideHandler = (e: MouseEvent) => {
const target = e.target as HTMLElement | undefined;
if (!visible.value || !target) {
return;
}
if (menu.value?.contains(target) || subMenu.value?.$el?.contains(target)) {
return;
}
hide();
};
const show = (e: MouseEvent) => {
// 加settimeout是以为，如果菜单中的按钮监听的是mouseup，那么菜单显示出来时鼠标如果正好在菜单上就会马上触发按钮的mouseup
setTimeout(() => {
visible.value = true;
nextTick(() => {
const menuHeight = menu.value?.clientHeight || 0;
let top = e.clientY;
if (menuHeight + e.clientY > document.body.clientHeight) {
top = document.body.clientHeight - menuHeight;
}
if (menu.value?.contains(target) || subMenu.value?.$el?.contains(target)) {
return;
}
hide();
};
onMounted(() => {
if (props.isSubMenu) return;
menuStyle.value = {
top: `${top}px`,
left: `${e.clientX}px`,
};
globalThis.addEventListener('mousedown', hideHandler, true);
emit('show');
});
}, 300);
};
onUnmounted(() => {
if (props.isSubMenu) return;
const showSubMenu = (item: MenuItem) => {
const menuItem = item as MenuButton;
if (typeof item !== 'object' || !menuItem.items?.length) {
return;
}
globalThis.removeEventListener('mousedown', hideHandler, true);
subMenuData.value = menuItem.items;
if (menu.value) {
subMenu.value.show({
clientX: menu.value.offsetLeft + menu.value.clientWidth,
clientY: menu.value.offsetTop,
});
}
};
return {
menu,
subMenu,
visible,
menuStyle,
subMenuData,
onMounted(() => {
if (props.isSubMenu) return;
hide,
globalThis.addEventListener('mousedown', hideHandler, true);
});
show(e: MouseEvent) {
// 加settimeout是以为，如果菜单中的按钮监听的是mouseup，那么菜单显示出来时鼠标如果正好在菜单上就会马上触发按钮的mouseup
setTimeout(() => {
visible.value = true;
onUnmounted(() => {
if (props.isSubMenu) return;
nextTick(() => {
const menuHeight = menu.value?.clientHeight || 0;
globalThis.removeEventListener('mousedown', hideHandler, true);
});
let top = e.clientY;
if (menuHeight + e.clientY > document.body.clientHeight) {
top = document.body.clientHeight - menuHeight;
}
menuStyle.value = {
top: `${top}px`,
left: `${e.clientX}px`,
};
emit('show');
});
}, 300);
},
showSubMenu(item: MenuItem) {
const menuItem = item as MenuButton;
if (typeof item !== 'object' || !menuItem.items?.length) {
return;
}
subMenuData.value = menuItem.items;
if (menu.value) {
subMenu.value.show({
clientX: menu.value.offsetLeft + menu.value.clientWidth,
clientY: menu.value.offsetTop,
});
}
},
};
},
defineExpose({
hide,
show,
});
</script>

313
packages/editor/src/components/ToolButton.vue
View File

@ -50,8 +50,8 @@
</div>
</template>
<script lang="ts">
import { computed, defineComponent, inject, markRaw, PropType } from 'vue';
<script lang="ts" setup>
import { computed, inject, markRaw, PropType } from 'vue';
import { ArrowDown, Back, Delete, Grid, Right, ScaleToOriginal, ZoomIn, ZoomOut } from '@element-plus/icons-vue';
import { NodeType } from '@tmagic/schema';
@ -59,171 +59,154 @@ import { NodeType } from '@tmagic/schema';
import MIcon from '@editor/components/Icon.vue';
import type { MenuButton, MenuComponent, MenuItem, Services } from '@editor/type';
export default defineComponent({
components: { MIcon, ArrowDown },
props: {
data: {
type: [Object, String] as PropType<MenuItem | string>,
require: true,
default: () => ({
type: 'text',
display: false,
}),
},
eventType: {
type: String as PropType<'mousedown' | 'mouseup' | 'click'>,
default: 'click',
},
const props = defineProps({
data: {
type: [Object, String] as PropType<MenuItem | string>,
require: true,
default: () => ({
type: 'text',
display: false,
}),
},
setup(props) {
const services = inject<Services>('services');
const uiService = services?.uiService;
const zoom = computed((): number => uiService?.get<number>('zoom') ?? 1);
const showGuides = computed((): boolean => uiService?.get<boolean>('showGuides') ?? true);
const showRule = computed((): boolean => uiService?.get<boolean>('showRule') ?? true);
const zoomInHandler = () => uiService?.zoom(0.1);
const zoomOutHandler = () => uiService?.zoom(-0.1);
const item = computed((): MenuButton | MenuComponent => {
if (typeof props.data !== 'string') {
return props.data;
}
switch (props.data) {
case '/':
return {
type: 'divider',
};
case 'zoom':
return {
type: 'zoom',
};
case 'delete':
return {
type: 'button',
icon: markRaw(Delete),
tooltip: '刪除',
disabled: () => services?.editorService.get('node')?.type === NodeType.PAGE,
handler: () => services?.editorService.remove(services?.editorService.get('node')),
};
case 'undo':
return {
type: 'button',
icon: markRaw(Back),
tooltip: '后退',
disabled: () => !services?.historyService.state.canUndo,
handler: () => services?.editorService.undo(),
};
case 'redo':
return {
type: 'button',
icon: markRaw(Right),
tooltip: '前进',
disabled: () => !services?.historyService.state.canRedo,
handler: () => services?.editorService.redo(),
};
case 'zoom-in':
return {
type: 'button',
icon: markRaw(ZoomIn),
tooltip: '放大',
handler: zoomInHandler,
};
case 'zoom-out':
return {
type: 'button',
icon: markRaw(ZoomOut),
tooltip: '縮小',
handler: zoomOutHandler,
};
case 'rule':
return {
type: 'button',
icon: markRaw(ScaleToOriginal),
tooltip: showRule.value ? '隐藏标尺' : '显示标尺',
handler: () => uiService?.set('showRule', !showRule.value),
};
case 'guides':
return {
type: 'button',
icon: markRaw(Grid),
tooltip: showGuides.value ? '隐藏参考线' : '显示参考线',
handler: () => uiService?.set('showGuides', !showGuides.value),
};
default:
return {
type: 'text',
text: props.data,
};
}
});
const disabled = computed(() => {
if (typeof item.value === 'string') return false;
if (item.value.type === 'component') return false;
if (typeof item.value.disabled === 'function') {
return item.value.disabled(services);
}
return item.value.disabled;
});
const buttonHandler = (item: MenuButton | MenuComponent, event: MouseEvent) => {
if (disabled.value) return;
if (typeof (item as MenuButton).handler === 'function' && services) {
(item as MenuButton).handler?.(services, event);
}
};
return {
ZoomIn: markRaw(ZoomIn),
ZoomOut: markRaw(ZoomOut),
item,
zoom,
disabled,
display: computed(() => {
if (!item.value) return false;
if (typeof item.value === 'string') return true;
if (typeof item.value.display === 'function') {
return item.value.display(services);
}
return item.value.display ?? true;
}),
zoomInHandler,
zoomOutHandler,
dropdownHandler(command: any) {
if (command.item.handler) {
command.item.handler(services);
}
},
clickHandler(item: MenuButton | MenuComponent, event: MouseEvent) {
if (props.eventType !== 'click') return;
if (item.type === 'button') {
buttonHandler(item, event);
}
},
mousedownHandler(item: MenuButton | MenuComponent, event: MouseEvent) {
if (props.eventType !== 'mousedown') return;
if (item.type === 'button') {
buttonHandler(item, event);
}
},
mouseupHandler(item: MenuButton | MenuComponent, event: MouseEvent) {
if (props.eventType !== 'mouseup') return;
if (item.type === 'button') {
buttonHandler(item, event);
}
},
};
eventType: {
type: String as PropType<'mousedown' | 'mouseup' | 'click'>,
default: 'click',
},
});
const services = inject<Services>('services');
const uiService = services?.uiService;
const zoom = computed((): number => uiService?.get<number>('zoom') ?? 1);
const showGuides = computed((): boolean => uiService?.get<boolean>('showGuides') ?? true);
const showRule = computed((): boolean => uiService?.get<boolean>('showRule') ?? true);
const zoomInHandler = () => uiService?.zoom(0.1);
const zoomOutHandler = () => uiService?.zoom(-0.1);
const item = computed((): MenuButton | MenuComponent => {
if (typeof props.data !== 'string') {
return props.data;
}
switch (props.data) {
case '/':
return {
type: 'divider',
};
case 'zoom':
return {
type: 'zoom',
};
case 'delete':
return {
type: 'button',
icon: markRaw(Delete),
tooltip: '刪除',
disabled: () => services?.editorService.get('node')?.type === NodeType.PAGE,
handler: () => services?.editorService.remove(services?.editorService.get('node')),
};
case 'undo':
return {
type: 'button',
icon: markRaw(Back),
tooltip: '后退',
disabled: () => !services?.historyService.state.canUndo,
handler: () => services?.editorService.undo(),
};
case 'redo':
return {
type: 'button',
icon: markRaw(Right),
tooltip: '前进',
disabled: () => !services?.historyService.state.canRedo,
handler: () => services?.editorService.redo(),
};
case 'zoom-in':
return {
type: 'button',
icon: markRaw(ZoomIn),
tooltip: '放大',
handler: zoomInHandler,
};
case 'zoom-out':
return {
type: 'button',
icon: markRaw(ZoomOut),
tooltip: '縮小',
handler: zoomOutHandler,
};
case 'rule':
return {
type: 'button',
icon: markRaw(ScaleToOriginal),
tooltip: showRule.value ? '隐藏标尺' : '显示标尺',
handler: () => uiService?.set('showRule', !showRule.value),
};
case 'guides':
return {
type: 'button',
icon: markRaw(Grid),
tooltip: showGuides.value ? '隐藏参考线' : '显示参考线',
handler: () => uiService?.set('showGuides', !showGuides.value),
};
default:
return {
type: 'text',
text: props.data,
};
}
});
const disabled = computed(() => {
if (typeof item.value === 'string') return false;
if (item.value.type === 'component') return false;
if (typeof item.value.disabled === 'function') {
return item.value.disabled(services);
}
return item.value.disabled;
});
const buttonHandler = (item: MenuButton | MenuComponent, event: MouseEvent) => {
if (disabled.value) return;
if (typeof (item as MenuButton).handler === 'function' && services) {
(item as MenuButton).handler?.(services, event);
}
};
const display = computed(() => {
if (!item.value) return false;
if (typeof item.value === 'string') return true;
if (typeof item.value.display === 'function') {
return item.value.display(services);
}
return item.value.display ?? true;
});
const dropdownHandler = (command: any) => {
if (command.item.handler) {
command.item.handler(services);
}
};
const clickHandler = (item: MenuButton | MenuComponent, event: MouseEvent) => {
if (props.eventType !== 'click') return;
if (item.type === 'button') {
buttonHandler(item, event);
}
};
const mousedownHandler = (item: MenuButton | MenuComponent, event: MouseEvent) => {
if (props.eventType !== 'mousedown') return;
if (item.type === 'button') {
buttonHandler(item, event);
}
};
const mouseupHandler = (item: MenuButton | MenuComponent, event: MouseEvent) => {
if (props.eventType !== 'mouseup') return;
if (item.type === 'button') {
buttonHandler(item, event);
}
};
</script>

120
packages/editor/src/fields/UISelect.vue
View File

@ -12,89 +12,69 @@
</div>
</template>
<script lang="ts">
import { computed, defineComponent, inject, markRaw, ref } from 'vue';
import { Close, Delete, Pointer } from '@element-plus/icons-vue';
<script lang="ts" setup>
import { computed, inject, ref } from 'vue';
import { Close, Delete } from '@element-plus/icons-vue';
import { FormState } from '@tmagic/form';
import { Services } from '@editor/type';
export default defineComponent({
name: 'm-fields-ui-select',
const props = defineProps<{
labelWidth: string;
config: any;
model: any;
prop: string;
name: string;
}>();
props: {
labelWidth: String,
config: Object,
model: Object,
prop: {
type: String,
default() {
return '';
},
},
name: String,
},
const emit = defineEmits(['change']);
emits: ['change'],
const services = inject<Services>('services');
const mForm = inject<FormState>('mForm');
const val = computed(() => props.model[props.name]);
const uiSelectMode = ref(false);
setup(props: any, { emit }) {
const services = inject<Services>('services');
const mForm = inject<FormState>('mForm');
const val = computed(() => props.model[props.name]);
const uiSelectMode = ref(false);
const cancelHandler = () => {
if (!services?.uiService) return;
services.uiService.set<boolean>('uiSelectMode', false);
uiSelectMode.value = false;
globalThis.document.removeEventListener('ui-select', clickHandler as EventListener);
};
const cancelHandler = () => {
if (!services?.uiService) return;
services.uiService.set<boolean>('uiSelectMode', false);
uiSelectMode.value = false;
globalThis.document.removeEventListener('ui-select', clickHandler as EventListener);
};
const clickHandler = ({ detail }: Event & { detail: any }) => {
if (detail.id) {
props.model[props.name] = detail.id;
emit('change', detail.id);
mForm?.$emit('field-change', props.prop, detail.id);
}
const clickHandler = ({ detail }: Event & { detail: any }) => {
if (detail.id) {
props.model[props.name] = detail.id;
emit('change', detail.id);
mForm?.$emit('field-change', props.prop, detail.id);
}
if (cancelHandler) {
cancelHandler();
}
};
if (cancelHandler) {
cancelHandler();
}
};
return {
Delete: markRaw(Delete),
Pointer: markRaw(Pointer),
Close: markRaw(Close),
val,
uiSelectMode,
toName: computed(() => {
const config = services?.editorService.getNodeById(val.value);
return config?.name || '';
}),
startSelect() {
if (!services?.uiService) return;
services.uiService.set<boolean>('uiSelectMode', true);
uiSelectMode.value = true;
globalThis.document.addEventListener('ui-select', clickHandler as EventListener);
},
cancelHandler,
deleteHandler() {
if (props.model) {
props.model[props.name] = '';
emit('change', '');
mForm?.$emit('field-change', props.prop, '');
}
},
};
},
const toName = computed(() => {
const config = services?.editorService.getNodeById(val.value);
return config?.name || '';
});
const startSelect = () => {
if (!services?.uiService) return;
services.uiService.set<boolean>('uiSelectMode', true);
uiSelectMode.value = true;
globalThis.document.addEventListener('ui-select', clickHandler as EventListener);
};
const deleteHandler = () => {
if (props.model) {
props.model[props.name] = '';
emit('change', '');
mForm?.$emit('field-change', props.prop, '');
}
};
</script>
<style lang="scss">
.m-fields-ui-select {
cursor: pointer;

99
packages/editor/src/layouts/workspace/PageBar.vue
View File

@ -3,10 +3,19 @@
<div id="m-editor-page-bar-add-icon" class="m-editor-page-bar-item m-editor-page-bar-item-icon" @click="addPage">
<el-icon><plus></plus></el-icon>
</div>
<div v-if="canScroll" class="m-editor-page-bar-item m-editor-page-bar-item-icon" @click="scroll('left')">
<div
v-if="scrollState.canScroll"
class="m-editor-page-bar-item m-editor-page-bar-item-icon"
@click="scrollState.scroll('left')"
>
<el-icon><arrow-left-bold></arrow-left-bold></el-icon>
</div>
<div v-if="root" class="m-editor-page-bar-items" ref="itemsContainer" :style="`width: ${itemsContainerWidth}px`">
<div
v-if="root"
class="m-editor-page-bar-items"
ref="itemsContainer"
:style="`width: ${scrollState.itemsContainerWidth}px`"
>
<div
v-for="item in root.items"
:key="item.key"
@ -51,25 +60,18 @@
</el-popover>
</div>
</div>
<div v-if="canScroll" class="m-editor-page-bar-item m-editor-page-bar-item-icon" @click="scroll('right')">
<div
v-if="scrollState.canScroll"
class="m-editor-page-bar-item m-editor-page-bar-item-icon"
@click="scrollState.scroll('right')"
>
<el-icon><arrow-right-bold></arrow-right-bold></el-icon>
</div>
</div>
</template>
<script lang="ts">
import {
computed,
ComputedRef,
defineComponent,
inject,
markRaw,
onMounted,
onUnmounted,
ref,
toRaw,
watch,
} from 'vue';
<script lang="ts" setup>
import { computed, ComputedRef, inject, onMounted, onUnmounted, ref, toRaw, watch } from 'vue';
import { ArrowLeftBold, ArrowRightBold, CaretBottom, Delete, DocumentCopy, Plus } from '@element-plus/icons-vue';
import type { MApp, MPage } from '@tmagic/schema';
@ -163,49 +165,36 @@ const useScroll = (root: ComputedRef<MApp | undefined>) => {
};
};
export default defineComponent({
components: { ArrowLeftBold, ArrowRightBold, CaretBottom, Plus, ToolButton },
const services = inject<Services>('services');
const editorService = services?.editorService;
setup() {
const services = inject<Services>('services');
const editorService = services?.editorService;
const root = computed(() => editorService?.get<MApp>('root'));
const root = computed(() => editorService?.get<MApp>('root'));
const scrollState = useScroll(root);
const page = computed(() => editorService?.get('page'));
return {
Delete: markRaw(Delete),
DocumentCopy: markRaw(DocumentCopy),
const switchPage = (page: MPage) => {
editorService?.select(page);
};
...useScroll(root),
const addPage = () => {
if (!editorService) return;
const pageConfig = {
type: NodeType.PAGE,
name: generatePageNameByApp(toRaw(editorService.get('root'))),
};
editorService.add(pageConfig);
};
root,
page: computed(() => editorService?.get('page')),
const copy = (node: MPage) => {
node && editorService?.copy(node);
editorService?.paste({
left: 0,
top: 0,
});
};
switchPage(page: MPage) {
editorService?.select(page);
},
addPage() {
if (!editorService) return;
const pageConfig = {
type: NodeType.PAGE,
name: generatePageNameByApp(toRaw(editorService.get('root'))),
};
editorService.add(pageConfig);
},
copy(node: MPage) {
node && editorService?.copy(node);
editorService?.paste({
left: 0,
top: 0,
});
},
remove(node: MPage) {
editorService?.remove(node);
},
};
},
});
const remove = (node: MPage) => {
editorService?.remove(node);
};
</script>

413
packages/editor/src/layouts/workspace/Stage.vue
View File

@ -20,19 +20,8 @@
</scroll-viewer>
</template>
<script lang="ts">
import {
computed,
defineComponent,
inject,
markRaw,
onMounted,
onUnmounted,
ref,
toRaw,
watch,
watchEffect,
} from 'vue';
<script lang="ts" setup>
import { computed, inject, markRaw, onMounted, onUnmounted, ref, toRaw, watch, watchEffect } from 'vue';
import { cloneDeep } from 'lodash-es';
import type { MApp, MContainer, MNode, MPage } from '@tmagic/schema';
@ -58,224 +47,202 @@ import { getGuideLineFromCache } from '@editor/utils';
import ViewerMenu from './ViewerMenu.vue';
export default defineComponent({
name: 'magic-stage',
let stage: StageCore | null = null;
let runtime: Runtime | null = null;
components: {
ViewerMenu,
ScrollViewer,
},
const services = inject<Services>('services');
const stageOptions = inject<StageOptions>('stageOptions');
setup() {
let stage: StageCore | null = null;
let runtime: Runtime | null = null;
const stageWrap = ref<InstanceType<typeof ScrollViewer>>();
const stageContainer = ref<HTMLDivElement>();
const menu = ref<InstanceType<typeof ViewerMenu>>();
const services = inject<Services>('services');
const stageOptions = inject<StageOptions>('stageOptions');
const isMultiSelect = computed(() => services?.editorService.get('nodes')?.length > 1);
const stageRect = computed(() => services?.uiService.get<StageRect>('stageRect'));
const uiSelectMode = computed(() => services?.uiService.get<boolean>('uiSelectMode'));
const root = computed(() => services?.editorService.get<MApp>('root'));
const page = computed(() => services?.editorService.get<MPage>('page'));
const zoom = computed(() => services?.uiService.get<number>('zoom') || 1);
const node = computed(() => services?.editorService.get<MNode>('node'));
const stageWrap = ref<InstanceType<typeof ScrollViewer>>();
const stageContainer = ref<HTMLDivElement>();
const menu = ref<InstanceType<typeof ViewerMenu>>();
const getGuideLineKey = (key: string) => `${key}_${root.value?.id}_${page.value?.id}`;
const isMultiSelect = computed(() => services?.editorService.get('nodes')?.length > 1);
const stageRect = computed(() => services?.uiService.get<StageRect>('stageRect'));
const uiSelectMode = computed(() => services?.uiService.get<boolean>('uiSelectMode'));
const root = computed(() => services?.editorService.get<MApp>('root'));
const page = computed(() => services?.editorService.get<MPage>('page'));
const zoom = computed(() => services?.uiService.get<number>('zoom') || 1);
const node = computed(() => services?.editorService.get<MNode>('node'));
watchEffect(() => {
if (stage) return;
const getGuideLineKey = (key: string) => `${key}_${root.value?.id}_${page.value?.id}`;
if (!stageContainer.value) return;
if (!(stageOptions?.runtimeUrl || stageOptions?.render) || !root.value) return;
watchEffect(() => {
if (stage) return;
if (!stageContainer.value) return;
if (!(stageOptions?.runtimeUrl || stageOptions?.render) || !root.value) return;
stage = new StageCore({
render: stageOptions.render,
runtimeUrl: stageOptions.runtimeUrl,
zoom: zoom.value,
autoScrollIntoView: stageOptions.autoScrollIntoView,
isContainer: stageOptions.isContainer,
containerHighlightClassName: stageOptions.containerHighlightClassName,
containerHighlightDuration: stageOptions.containerHighlightDuration,
canSelect: (el, event, stop) => {
const elCanSelect = stageOptions.canSelect(el);
// 在组件联动过程中不能再往下选择，返回并触发 ui-select
if (uiSelectMode.value && elCanSelect && event.type === 'mousedown') {
document.dispatchEvent(new CustomEvent('ui-select', { detail: el }));
return stop();
}
return elCanSelect;
},
moveableOptions: stageOptions.moveableOptions,
updateDragEl: stageOptions.updateDragEl,
});
services?.editorService.set('stage', markRaw(stage));
stage?.mount(stageContainer.value);
stage.mask.setGuides([
getGuideLineFromCache(getGuideLineKey(H_GUIDE_LINE_STORAGE_KEY)),
getGuideLineFromCache(getGuideLineKey(V_GUIDE_LINE_STORAGE_KEY)),
]);
stage?.on('select', (el: HTMLElement) => {
services?.editorService.select(el.id);
});
stage?.on('highlight', (el: HTMLElement) => {
services?.editorService.highlight(el.id);
});
stage?.on('multiSelect', (els: HTMLElement[]) => {
services?.editorService.multiSelect(els.map((el) => el.id));
});
stage?.on('update', (ev: UpdateEventData) => {
if (ev.parentEl) {
services?.editorService.moveToContainer({ id: ev.el.id, style: ev.style }, ev.parentEl.id);
return;
}
services?.editorService.update({ id: ev.el.id, style: ev.style });
});
stage?.on('sort', (ev: SortEventData) => {
services?.editorService.sort(ev.src, ev.dist);
});
stage?.on('changeGuides', (e) => {
services?.uiService.set('showGuides', true);
if (!root.value || !page.value) return;
const storageKey = getGuideLineKey(
e.type === GuidesType.HORIZONTAL ? H_GUIDE_LINE_STORAGE_KEY : V_GUIDE_LINE_STORAGE_KEY,
);
if (e.guides.length) {
globalThis.localStorage.setItem(storageKey, JSON.stringify(e.guides));
} else {
globalThis.localStorage.removeItem(storageKey);
}
});
if (!node.value?.id) return;
stage?.on('runtime-ready', (rt) => {
runtime = rt;
// toRaw返回的值是一个引用而非快照，需要cloneDeep
root.value && runtime?.updateRootConfig?.(cloneDeep(toRaw(root.value)));
page.value?.id && runtime?.updatePageId?.(page.value.id);
setTimeout(() => {
node.value && stage?.select(toRaw(node.value.id));
});
});
});
watch(zoom, (zoom) => {
if (!stage || !zoom) return;
stage.setZoom(zoom);
});
watch(root, (root) => {
if (runtime && root) {
runtime.updateRootConfig?.(cloneDeep(toRaw(root)));
stage = new StageCore({
render: stageOptions.render,
runtimeUrl: stageOptions.runtimeUrl,
zoom: zoom.value,
autoScrollIntoView: stageOptions.autoScrollIntoView,
isContainer: stageOptions.isContainer,
containerHighlightClassName: stageOptions.containerHighlightClassName,
containerHighlightDuration: stageOptions.containerHighlightDuration,
canSelect: (el, event, stop) => {
const elCanSelect = stageOptions.canSelect(el);
// 在组件联动过程中不能再往下选择，返回并触发 ui-select
if (uiSelectMode.value && elCanSelect && event.type === 'mousedown') {
document.dispatchEvent(new CustomEvent('ui-select', { detail: el }));
return stop();
}
return elCanSelect;
},
moveableOptions: stageOptions.moveableOptions,
updateDragEl: stageOptions.updateDragEl,
});
services?.editorService.set('stage', markRaw(stage));
stage?.mount(stageContainer.value);
stage.mask.setGuides([
getGuideLineFromCache(getGuideLineKey(H_GUIDE_LINE_STORAGE_KEY)),
getGuideLineFromCache(getGuideLineKey(V_GUIDE_LINE_STORAGE_KEY)),
]);
stage?.on('select', (el: HTMLElement) => {
services?.editorService.select(el.id);
});
stage?.on('highlight', (el: HTMLElement) => {
services?.editorService.highlight(el.id);
});
stage?.on('multiSelect', (els: HTMLElement[]) => {
services?.editorService.multiSelect(els.map((el) => el.id));
});
stage?.on('update', (ev: UpdateEventData) => {
if (ev.parentEl) {
services?.editorService.moveToContainer({ id: ev.el.id, style: ev.style }, ev.parentEl.id);
return;
}
services?.editorService.update({ id: ev.el.id, style: ev.style });
});
stage?.on('sort', (ev: SortEventData) => {
services?.editorService.sort(ev.src, ev.dist);
});
stage?.on('changeGuides', (e) => {
services?.uiService.set('showGuides', true);
if (!root.value || !page.value) return;
const storageKey = getGuideLineKey(
e.type === GuidesType.HORIZONTAL ? H_GUIDE_LINE_STORAGE_KEY : V_GUIDE_LINE_STORAGE_KEY,
);
if (e.guides.length) {
globalThis.localStorage.setItem(storageKey, JSON.stringify(e.guides));
} else {
globalThis.localStorage.removeItem(storageKey);
}
});
if (!node.value?.id) return;
stage?.on('runtime-ready', (rt) => {
runtime = rt;
// toRaw返回的值是一个引用而非快照，需要cloneDeep
root.value && runtime?.updateRootConfig?.(cloneDeep(toRaw(root.value)));
page.value?.id && runtime?.updatePageId?.(page.value.id);
setTimeout(() => {
node.value && stage?.select(toRaw(node.value.id));
});
const resizeObserver = new ResizeObserver((entries) => {
for (const { contentRect } of entries) {
services?.uiService.set('stageContainerRect', {
width: contentRect.width,
height: contentRect.height,
});
}
});
onMounted(() => {
stageWrap.value?.container && resizeObserver.observe(stageWrap.value.container);
});
onUnmounted(() => {
stage?.destroy();
resizeObserver.disconnect();
services?.editorService.set('stage', null);
});
return {
stageWrap,
stageContainer,
menu,
stageRect,
zoom,
isMultiSelect,
contextmenuHandler(e: MouseEvent) {
e.preventDefault();
menu.value?.show(e);
},
dragoverHandler(e: DragEvent) {
e.preventDefault();
if (e.dataTransfer) {
e.dataTransfer.dropEffect = 'move';
}
},
async dropHandler(e: DragEvent) {
e.preventDefault();
const doc = stage?.renderer.contentWindow?.document;
const parentEl: HTMLElement | null | undefined = doc?.querySelector(
`.${stageOptions?.containerHighlightClassName}`,
);
let parent: MContainer | undefined = page.value;
if (parentEl) {
parent = services?.editorService.getNodeById(parentEl.id, false) as MContainer;
}
if (e.dataTransfer && parent && stageContainer.value && stage) {
// eslint-disable-next-line no-eval
const config = eval(`(${e.dataTransfer.getData('data')})`);
const layout = await services?.editorService.getLayout(parent);
const containerRect = stageContainer.value.getBoundingClientRect();
const { scrollTop, scrollLeft } = stage.mask;
const { style = {} } = config;
let top = 0;
let left = 0;
let position = 'relative';
if (layout === Layout.ABSOLUTE) {
position = 'absolute';
top = e.clientY - containerRect.top + scrollTop;
left = e.clientX - containerRect.left + scrollLeft;
if (parentEl && doc) {
const { left: parentLeft, top: parentTop } = getOffset(parentEl);
left = left - calcValueByFontsize(doc, parentLeft);
top = top - calcValueByFontsize(doc, parentTop);
}
}
config.style = {
...style,
position,
top,
left,
};
config.inputEvent = e;
services?.editorService.add(config, parent);
}
},
};
},
});
});
watch(zoom, (zoom) => {
if (!stage || !zoom) return;
stage.setZoom(zoom);
});
watch(root, (root) => {
if (runtime && root) {
runtime.updateRootConfig?.(cloneDeep(toRaw(root)));
}
});
const resizeObserver = new ResizeObserver((entries) => {
for (const { contentRect } of entries) {
services?.uiService.set('stageContainerRect', {
width: contentRect.width,
height: contentRect.height,
});
}
});
onMounted(() => {
stageWrap.value?.container && resizeObserver.observe(stageWrap.value.container);
});
onUnmounted(() => {
stage?.destroy();
resizeObserver.disconnect();
services?.editorService.set('stage', null);
});
const contextmenuHandler = (e: MouseEvent) => {
e.preventDefault();
menu.value?.show(e);
};
const dragoverHandler = (e: DragEvent) => {
e.preventDefault();
if (e.dataTransfer) {
e.dataTransfer.dropEffect = 'move';
}
};
const dropHandler = async (e: DragEvent) => {
e.preventDefault();
const doc = stage?.renderer.contentWindow?.document;
const parentEl: HTMLElement | null | undefined = doc?.querySelector(`.${stageOptions?.containerHighlightClassName}`);
let parent: MContainer | undefined = page.value;
if (parentEl) {
parent = services?.editorService.getNodeById(parentEl.id, false) as MContainer;
}
if (e.dataTransfer && parent && stageContainer.value && stage) {
// eslint-disable-next-line no-eval
const config = eval(`(${e.dataTransfer.getData('data')})`);
const layout = await services?.editorService.getLayout(parent);
const containerRect = stageContainer.value.getBoundingClientRect();
const { scrollTop, scrollLeft } = stage.mask;
const { style = {} } = config;
let top = 0;
let left = 0;
let position = 'relative';
if (layout === Layout.ABSOLUTE) {
position = 'absolute';
top = e.clientY - containerRect.top + scrollTop;
left = e.clientX - containerRect.left + scrollLeft;
if (parentEl && doc) {
const { left: parentLeft, top: parentTop } = getOffset(parentEl);
left = left - calcValueByFontsize(doc, parentLeft);
top = top - calcValueByFontsize(doc, parentTop);
}
}
config.style = {
...style,
position,
top,
left,
};
config.inputEvent = e;
services?.editorService.add(config, parent);
}
};
</script>

291
packages/editor/src/layouts/workspace/ViewerMenu.vue
View File

@ -2,8 +2,8 @@
<content-menu :menu-data="menuData" ref="menu"></content-menu>
</template>
<script lang="ts">
import { computed, defineComponent, inject, markRaw, onMounted, reactive, ref, watch } from 'vue';
<script lang="ts" setup>
import { computed, inject, markRaw, onMounted, reactive, ref, watch } from 'vue';
import { Bottom, Delete, DocumentCopy, Top } from '@element-plus/icons-vue';
import { MNode, NodeType } from '@tmagic/schema';
@ -15,159 +15,146 @@ import storageService from '@editor/services/storage';
import { LayerOffset, Layout, MenuItem, Services } from '@editor/type';
import { COPY_STORAGE_KEY } from '@editor/utils/editor';
export default defineComponent({
components: { ContentMenu },
const props = withDefaults(defineProps<{ isMultiSelect?: boolean }>(), { isMultiSelect: false });
props: {
isMultiSelect: {
type: Boolean,
default: false,
const services = inject<Services>('services');
const editorService = services?.editorService;
const menu = ref<InstanceType<typeof ContentMenu>>();
const canPaste = ref(false);
const canCenter = ref(false);
const node = computed(() => editorService?.get<MNode>('node'));
const nodes = computed(() => editorService?.get<MNode[]>('nodes'));
const parent = computed(() => editorService?.get('parent'));
const stage = computed(() => editorService?.get<StageCore>('stage'));
const stageContentMenu = inject<MenuItem[]>('stageContentMenu', []);
const menuData = reactive<MenuItem[]>([
{
type: 'button',
text: '水平居中',
display: () => canCenter.value && !props.isMultiSelect,
handler: () => {
if (!node.value) return;
editorService?.alignCenter(node.value);
},
},
setup(props) {
const services = inject<Services>('services');
const editorService = services?.editorService;
const menu = ref<InstanceType<typeof ContentMenu>>();
const canPaste = ref(false);
const canCenter = ref(false);
const node = computed(() => editorService?.get<MNode>('node'));
const nodes = computed(() => editorService?.get<MNode[]>('nodes'));
const parent = computed(() => editorService?.get('parent'));
const stage = computed(() => editorService?.get<StageCore>('stage'));
const stageContentMenu = inject<MenuItem[]>('stageContentMenu', []);
const menuData = reactive<MenuItem[]>([
{
type: 'button',
text: '水平居中',
display: () => canCenter.value && !props.isMultiSelect,
handler: () => {
if (!node.value) return;
editorService?.alignCenter(node.value);
},
},
{
type: 'button',
text: '复制',
icon: markRaw(DocumentCopy),
handler: () => {
nodes.value && editorService?.copy(nodes.value);
canPaste.value = true;
},
},
{
type: 'button',
text: '粘贴',
display: () => canPaste.value,
handler: () => {
const rect = menu.value?.$el.getBoundingClientRect();
const parentRect = stage.value?.container?.getBoundingClientRect();
const initialLeft = (rect?.left || 0) - (parentRect?.left || 0);
const initialTop = (rect?.top || 0) - (parentRect?.top || 0);
if (!nodes.value || nodes.value.length === 0) return;
editorService?.paste({ left: initialLeft, top: initialTop });
},
},
{
type: 'divider',
direction: 'horizontal',
display: () => {
if (!node.value) return false;
return !isPage(node.value);
},
},
{
type: 'button',
text: '上移一层',
icon: markRaw(Top),
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(1);
},
},
{
type: 'button',
text: '下移一层',
icon: markRaw(Bottom),
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(-1);
},
},
{
type: 'button',
text: '置顶',
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(LayerOffset.TOP);
},
},
{
type: 'button',
text: '置底',
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(LayerOffset.BOTTOM);
},
},
{
type: 'divider',
direction: 'horizontal',
display: () => !isPage(node.value) && !props.isMultiSelect,
},
{
type: 'button',
text: '删除',
icon: Delete,
display: () => !isPage(node.value),
handler: () => {
nodes.value && editorService?.remove(nodes.value);
},
},
{
type: 'divider',
direction: 'horizontal',
},
{
type: 'button',
text: '清空参考线',
handler: () => {
editorService?.get<StageCore>('stage').clearGuides();
},
},
...stageContentMenu,
]);
onMounted(async () => {
const data = await storageService.getItem(COPY_STORAGE_KEY);
canPaste.value = data !== 'undefined' && !!data;
});
watch(
parent,
async () => {
if (!parent.value || !editorService) return (canCenter.value = false);
const layout = await editorService.getLayout(parent.value);
const isLayoutConform = [Layout.ABSOLUTE, Layout.FIXED].includes(layout);
const isTypeConform = nodes.value?.every(
(selectedNode) => ![NodeType.ROOT, NodeType.PAGE, 'pop'].includes(`${selectedNode?.type}`),
);
canCenter.value = isLayoutConform && !!isTypeConform;
},
{ immediate: true },
);
return {
menu,
menuData,
show(e: MouseEvent) {
menu.value?.show(e);
},
};
{
type: 'button',
text: '复制',
icon: markRaw(DocumentCopy),
handler: () => {
nodes.value && editorService?.copy(nodes.value);
canPaste.value = true;
},
},
{
type: 'button',
text: '粘贴',
display: () => canPaste.value,
handler: () => {
const rect = menu.value?.$el.getBoundingClientRect();
const parentRect = stage.value?.container?.getBoundingClientRect();
const initialLeft = (rect?.left || 0) - (parentRect?.left || 0);
const initialTop = (rect?.top || 0) - (parentRect?.top || 0);
if (!nodes.value || nodes.value.length === 0) return;
editorService?.paste({ left: initialLeft, top: initialTop });
},
},
{
type: 'divider',
direction: 'horizontal',
display: () => {
if (!node.value) return false;
return !isPage(node.value);
},
},
{
type: 'button',
text: '上移一层',
icon: markRaw(Top),
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(1);
},
},
{
type: 'button',
text: '下移一层',
icon: markRaw(Bottom),
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(-1);
},
},
{
type: 'button',
text: '置顶',
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(LayerOffset.TOP);
},
},
{
type: 'button',
text: '置底',
display: () => !isPage(node.value) && !props.isMultiSelect,
handler: () => {
editorService?.moveLayer(LayerOffset.BOTTOM);
},
},
{
type: 'divider',
direction: 'horizontal',
display: () => !isPage(node.value) && !props.isMultiSelect,
},
{
type: 'button',
text: '删除',
icon: Delete,
display: () => !isPage(node.value),
handler: () => {
nodes.value && editorService?.remove(nodes.value);
},
},
{
type: 'divider',
direction: 'horizontal',
},
{
type: 'button',
text: '清空参考线',
handler: () => {
editorService?.get<StageCore>('stage').clearGuides();
},
},
...stageContentMenu,
]);
onMounted(async () => {
const data = await storageService.getItem(COPY_STORAGE_KEY);
canPaste.value = data !== 'undefined' && !!data;
});
watch(
parent,
async () => {
if (!parent.value || !editorService) return (canCenter.value = false);
const layout = await editorService.getLayout(parent.value);
const isLayoutConform = [Layout.ABSOLUTE, Layout.FIXED].includes(layout);
const isTypeConform = nodes.value?.every(
(selectedNode) => ![NodeType.ROOT, NodeType.PAGE, 'pop'].includes(`${selectedNode?.type}`),
);
canCenter.value = isLayoutConform && !!isTypeConform;
},
{ immediate: true },
);
const show = (e: MouseEvent) => {
menu.value?.show(e);
};
defineExpose({ show });
</script>

4
packages/editor/src/services/componentList.ts
View File

@ -34,11 +34,11 @@ class ComponentList extends BaseService {
/**
* @param componentGroupList 组件列表配置
*/
public setList(componentGroupList: ComponentGroup[]) {
public setList(componentGroupList: ComponentGroup[]): void {
this.state.list = componentGroupList;
}
public getList() {
public getList(): ComponentGroup[] {
return this.state.list;
}
}

2
packages/editor/src/services/editor.ts
View File

@ -42,7 +42,7 @@ import { beforeAdd, beforePaste, beforeRemove, notifyAddToStage } from '@editor/
import BaseService from './BaseService';
class Editor extends BaseService {
public state = reactive<StoreState>({
public state: StoreState = reactive({
root: null,
page: null,
parent: null,

15
packages/editor/tsconfig.build.json Normal file
View File

@ -0,0 +1,15 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {
"@editor/*": ["src/*"],
},
},
"include": [
"src"
],
}

3
packages/editor/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

19
packages/editor/vite.config.ts
View File

@ -19,7 +19,6 @@
import path from 'path';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
import vue from '@vitejs/plugin-vue';
import pkg from './package.json';
@ -27,16 +26,7 @@ import pkg from './package.json';
const alias = [{ find: /@editor/, replacement: path.join(__dirname, './src') }];
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
vue(),
],
plugins: [vue()],
resolve: {
alias:
@ -67,12 +57,7 @@ export default defineConfig({
rollupOptions: {
// 确保外部化处理那些你不想打包进库的依赖
external(id: string) {
return (
/^vue/.test(id) ||
/^element-plus/.test(id) ||
/^@tmagic\//.test(id) ||
Object.keys(pkg.dependencies).some((k) => new RegExp(`^${k}`).test(id))
);
return Object.keys(pkg.dependencies).some((k) => new RegExp(`^${k}`).test(id));
},
output: {

10
packages/form/package.json
View File

@ -8,7 +8,7 @@
"main": "dist/tmagic-form.umd.js",
"module": "dist/tmagic-form.mjs",
"style": "dist/style.css",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-form.mjs",
@ -22,7 +22,9 @@
},
"license": "Apache-2.0",
"scripts": {
"build": "vue-tsc --noEmit && vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && vue-tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -52,10 +54,10 @@
"@vitejs/plugin-vue": "^3.0.1",
"@vue/compiler-sfc": "^3.2.37",
"@vue/test-utils": "^2.0.0",
"rimraf": "^3.0.2",
"sass": "^1.35.1",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6",
"vue-tsc": "^0.38.2"
"vue-tsc": "^0.39.4"
}
}

10
packages/form/src/Form.vue
View File

@ -26,22 +26,17 @@
<script lang="ts">
import { defineComponent, PropType, provide, reactive, ref, toRaw, watch } from 'vue';
import { ElForm } from 'element-plus';
import { cloneDeep, isEqual } from 'lodash-es';
import { getConfig } from './utils/config';
import { initValue } from './utils/form';
import { FormConfig, FormState, FormValue } from './schema';
export interface ValidateError {
interface ValidateError {
message: string;
field: string;
}
export interface FieldErrorList {
[field: string]: ValidateError[];
}
export default defineComponent({
name: 'm-form',
@ -112,7 +107,8 @@ export default defineComponent({
emits: ['change', 'field-input', 'field-change'],
setup(props, { emit }) {
const elForm = ref<InstanceType<typeof ElForm>>();
// InstanceType<typeof ElForm>，构建types的时候会出错
const elForm = ref<any>();
const initialized = ref(false);
const values = ref<FormValue>({});
const fields = new Map<string, any>();

8
packages/form/src/fields/Cascader.vue
View File

@ -24,11 +24,9 @@ import {
getCurrentInstance,
inject,
PropType,
Ref,
ref,
watchEffect,
} from 'vue';
import { ElCascader, ElDialog } from 'element-plus';
import { CascaderConfig, FormState } from '../schema';
import { getConfig } from '../utils/config';
@ -56,11 +54,11 @@ export default defineComponent({
const requestFunc = getConfig('request') as Function;
const cascader: Ref<null | typeof ElCascader> = ref(null);
const dialog: Ref<null | typeof ElDialog> = ref(null);
const cascader = ref<any>();
const dialog = ref<any>();
const options = Array.isArray(props.config.options) ? ref(props.config.options) : ref([]);
const remoteData: Ref<any> = ref(null);
const remoteData = ref<any>(null);
const setRemoteOptions = async function () {
const { config } = props;

49
packages/form/src/fields/ColorPicker.vue
View File

@ -1,36 +1,29 @@
<template>
<div v-if="model">
<el-color-picker
v-model="model[name]"
:size="size"
:disabled="disabled"
:showAlpha="true"
@change="changeHandler"
></el-color-picker>
</div>
<el-color-picker
v-model="model[name]"
:size="size"
:disabled="disabled"
:showAlpha="true"
@change="changeHandler"
></el-color-picker>
</template>
<script lang="ts">
import { defineComponent, PropType } from 'vue';
import { ColorPickConfig } from '../schema';
import fieldProps from '../utils/fieldProps';
import { useAddField } from '../utils/useAddField';
export default defineComponent({
name: 'm-fields-color-picker',
});
</script>
<script lang="ts" setup>
const emit = defineEmits(['change']);
import { ColorPickConfig } from '../schema';
import { useAddField } from '../utils/useAddField';
const props = defineProps({
...fieldProps,
config: {
type: Object as PropType<ColorPickConfig>,
required: true,
},
});
const props = defineProps<{
config: ColorPickConfig;
model: any;
initValues?: any;
values?: any;
name: string;
prop: string;
disabled?: boolean;
size: 'mini' | 'small' | 'medium';
}>();
const emit = defineEmits(['change']);
useAddField(props.prop);

36
packages/form/src/fields/Display.vue
View File

@ -1,33 +1,23 @@
<template>
<span v-if="model">{{ model[n] }}</span>
<span v-if="model">{{ model[name] }}</span>
</template>
<script lang="ts">
import { computed, defineComponent, PropType } from 'vue';
<script setup lang="ts">
import { DisplayConfig } from '../schema';
import fieldProps from '../utils/fieldProps';
import { useAddField } from '../utils/useAddField';
export default defineComponent({
name: 'm-fields-display',
});
</script>
const props = defineProps<{
config: DisplayConfig;
model: any;
initValues?: any;
values?: any;
name: string;
prop: string;
}>();
<script setup lang="ts">
const props = defineProps({
...fieldProps,
config: {
type: Object as PropType<DisplayConfig>,
required: true,
},
});
const n = computed(() => props.name || props.config.name || '');
if (props.config.initValue && n.value && props.model) {
// eslint-disable-next-line no-param-reassign,vue/no-setup-props-destructure
props.model[n.value] = props.config.initValue;
if (props.config.initValue && props.model) {
// eslint-disable-next-line vue/no-setup-props-destructure
props.model[props.name] = props.config.initValue;
}
useAddField(props.prop);

30
packages/form/src/fields/Hidden.vue
View File

@ -1,29 +1,19 @@
<template>
<input v-if="model" v-model="model[n]" type="hidden" />
<input v-if="model" v-model="model[name]" type="hidden" />
</template>
<script lang="ts">
import { computed, defineComponent, PropType } from 'vue';
<script setup lang="ts">
import { HiddenConfig } from '../schema';
import fieldProps from '../utils/fieldProps';
import { useAddField } from '../utils/useAddField';
export default defineComponent({
name: 'm-fields-hidden',
});
</script>
<script setup lang="ts">
const props = defineProps({
...fieldProps,
config: {
type: Object as PropType<HiddenConfig>,
required: true,
},
});
const n = computed(() => props.name || props.config.name || '');
const props = defineProps<{
config: HiddenConfig;
model: any;
initValues?: any;
values?: any;
name: string;
prop: string;
}>();
useAddField(props.prop);
</script>

3
packages/form/src/fields/Select.vue
View File

@ -27,7 +27,6 @@
<script lang="ts">
import { defineComponent, inject, onBeforeMount, onMounted, PropType, Ref, ref, watch } from 'vue';
import { ElSelect } from 'element-plus';
import { FormState, SelectConfig, SelectGroupOption, SelectOption } from '../schema';
import { getConfig } from '../utils/config';
@ -56,7 +55,7 @@ export default defineComponent({
if (!props.model) throw new Error('不能没有model');
useAddField(props.prop);
const select = ref<typeof ElSelect>();
const select = ref<any>();
const mForm = inject<FormState | undefined>('mForm');
const options = ref<SelectOption[] | SelectGroupOption[]>([]);
const localOptions = ref<SelectOption[] | SelectGroupOption[]>([]);

6
packages/form/src/index.ts
View File

@ -105,17 +105,17 @@ const install = (app: App, opt: any) => {
app.component(Text.name, Text);
app.component(Number.name, Number);
app.component(Textarea.name, Textarea);
app.component(Hidden.name, Hidden);
app.component('m-fields-hidden', Hidden);
app.component(Date.name, Date);
app.component(DateTime.name, DateTime);
app.component(Time.name, Time);
app.component(Checkbox.name, Checkbox);
app.component(Switch.name, Switch);
app.component(Daterange.name, Daterange);
app.component(ColorPicker.name, ColorPicker);
app.component('m-fields-color-picker', ColorPicker);
app.component(CheckboxGroup.name, CheckboxGroup);
app.component(RadioGroup.name, RadioGroup);
app.component(Display.name, Display);
app.component('m-fields-display', Display);
app.component(Link.name, Link);
app.component(Select.name, Select);
app.component(Cascader.name, Cascader);

13
packages/form/tsconfig.build.json Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {},
},
"include": [
"src"
],
}

3
packages/form/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

12
packages/form/vite.config.ts
View File

@ -19,22 +19,12 @@
import path from 'path';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
import vue from '@vitejs/plugin-vue';
import pkg from './package.json';
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
vue(),
],
plugins: [vue()],
resolve: {
alias:

10
packages/schema/package.json
View File

@ -4,7 +4,7 @@
"sideEffects": false,
"main": "dist/tmagic-schema.umd.js",
"module": "dist/tmagic-schema.mjs",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-schema.mjs",
@ -13,7 +13,9 @@
"./*": "./*"
},
"scripts": {
"build": "vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -25,8 +27,8 @@
},
"devDependencies": {
"@types/node": "^15.12.4",
"rimraf": "^3.0.2",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6"
"vite": "^3.0.4"
}
}

13
packages/schema/tsconfig.build.json Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {},
},
"include": [
"src"
],
}

3
packages/schema/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

11
packages/schema/vite.config.ts
View File

@ -1,17 +1,6 @@
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
],
build: {
sourcemap: true,

10
packages/stage/package.json
View File

@ -6,7 +6,7 @@
],
"main": "dist/tmagic-stage.umd.js",
"module": "dist/tmagic-stage.mjs",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-stage.mjs",
@ -16,7 +16,9 @@
},
"license": "Apache-2.0",
"scripts": {
"build": "vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -40,9 +42,9 @@
"@types/events": "^3.0.0",
"@types/lodash-es": "^4.17.4",
"@types/node": "^15.12.4",
"rimraf": "^3.0.2",
"sass": "^1.35.1",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6"
"vite": "^3.0.4"
}
}

2
packages/stage/src/StageDragResize.ts
View File

@ -484,7 +484,7 @@ export default class StageDragResize extends EventEmitter {
}
private setGhostElChildrenId(el: Element) {
for (const child of el.children) {
for (const child of Array.from(el.children)) {
if (child.id) {
child.id = `${GHOST_EL_ID_PREFIX}${child.id}`;
}

13
packages/stage/tsconfig.build.json Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {},
},
"include": [
"src"
],
}

3
packages/stage/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

11
packages/stage/vite.config.ts
View File

@ -19,21 +19,10 @@
import path from 'path';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
import pkg from './package.json';
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
],
resolve: {
alias:
process.env.NODE_ENV === 'production'

11
packages/table/package.json
View File

@ -6,7 +6,7 @@
],
"main": "dist/tmagic-table.umd.js",
"module": "dist/tmagic-table.mjs",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-table.mjs",
@ -20,7 +20,9 @@
},
"license": "Apache-2.0",
"scripts": {
"build": "vue-tsc --noEmit && vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && vue-tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -31,6 +33,7 @@
},
"dependencies": {
"@tmagic/form": "1.1.0-beta.5",
"@tmagic/utils": "1.1.0-beta.5",
"element-plus": "^2.2.6",
"lodash-es": "^4.17.21",
"vue": "^3.2.37"
@ -47,10 +50,10 @@
"@vitejs/plugin-vue": "^3.0.1",
"@vue/compiler-sfc": "^3.2.37",
"@vue/test-utils": "^2.0.0",
"rimraf": "^3.0.2",
"sass": "^1.35.1",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6",
"vue-tsc": "^0.38.2"
"vue-tsc": "^0.39.4"
}
}

13
packages/table/tsconfig.build.json Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {},
},
"include": [
"src"
],
}

3
packages/table/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

12
packages/table/vite.config.ts
View File

@ -19,22 +19,12 @@
import path from 'path';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
import vue from '@vitejs/plugin-vue';
import pkg from './package.json';
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
vue(),
],
plugins: [vue()],
resolve: {
alias:

10
packages/utils/package.json
View File

@ -3,7 +3,7 @@
"name": "@tmagic/utils",
"main": "dist/tmagic-utils.umd.js",
"module": "dist/tmagic-utils.mjs",
"types": "dist/types/src/index.d.ts",
"types": "types/index.d.ts",
"exports": {
".": {
"import": "./dist/tmagic-utils.mjs",
@ -12,7 +12,9 @@
},
"license": "Apache-2.0",
"scripts": {
"build": "vite build"
"build": "npm run build:type && vite build",
"build:type": "npm run clear:type && tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
"clear:type": "rimraf ./types"
},
"engines": {
"node": ">=14"
@ -28,7 +30,7 @@
"devDependencies": {
"@types/node": "^15.12.4",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vite-plugin-dts": "^0.9.6"
"rimraf": "^3.0.2",
"vite": "^3.0.4"
}
}

2
packages/utils/src/index.ts
View File

@ -31,7 +31,7 @@ export const sleep = (ms: number): Promise<void> =>
}, ms);
});
export const datetimeFormatter = (v: string | Date, defaultValue = '-', f = 'YYYY-MM-DD HH:mm:ss') => {
export const datetimeFormatter = (v: string | Date, defaultValue = '-', f = 'YYYY-MM-DD HH:mm:ss'): any => {
let format = f;
if (format === 'timestamp') {
format = 'x';

13
packages/utils/tsconfig.build.json Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"declarationDir": "types",
"forceConsistentCasingInFileNames": true,
"paths": {},
},
"include": [
"src"
],
}

3
packages/utils/tsconfig.json
View File

@ -3,7 +3,4 @@
"compilerOptions": {
"baseUrl": "../..",
},
"exclude": [
"**/dist/**/*"
],
}

11
packages/utils/vite.config.ts
View File

@ -17,23 +17,12 @@
*/
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
import pkg from './package.json';
const deps = Object.keys(pkg.dependencies);
export default defineConfig({
plugins: [
dts({
outputDir: 'dist/types',
include: ['src/**/*'],
staticImport: true,
insertTypesEntry: true,
logDiagnostics: true,
}),
],
build: {
cssCodeSplit: false,
sourcemap: true,

2
playground/package.json
View File

@ -34,6 +34,6 @@
"sass": "^1.35.1",
"typescript": "^4.7.4",
"vite": "^3.0.4",
"vue-tsc": "^0.38.2"
"vue-tsc": "^0.39.4"
}
}

147
pnpm-lock.yaml generated
View File

@ -138,18 +138,18 @@ importers:
'@types/events': ^3.0.0
'@types/node': ^15.12.4
events: ^3.3.0
rimraf: ^3.0.2
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
dependencies:
'@tmagic/schema': link:../schema
events: 3.3.0
devDependencies:
'@types/events': 3.0.0
'@types/node': 15.14.9
rimraf: 3.0.2
typescript: 4.7.4
vite: 3.0.4
vite-plugin-dts: 0.9.10_vite@3.0.4
packages/editor:
specifiers:
@ -175,13 +175,13 @@ importers:
keycon: ^1.1.2
lodash-es: ^4.17.21
monaco-editor: ^0.32.1
rimraf: ^3.0.2
sass: ^1.35.1
serialize-javascript: ^6.0.0
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
vue: ^3.2.37
vue-tsc: ^0.38.2
vue-tsc: ^0.39.4
dependencies:
'@babel/core': 7.18.2
'@element-plus/icons-vue': 2.0.6_vue@3.2.37
@ -208,11 +208,11 @@ importers:
'@vitejs/plugin-vue': 3.0.1_vite@3.0.4+vue@3.2.37
'@vue/compiler-sfc': 3.2.37
'@vue/test-utils': 2.0.0_vue@3.2.37
rimraf: 3.0.2
sass: 1.52.2
typescript: 4.7.4
vite: 3.0.4_sass@1.52.2
vite-plugin-dts: 0.9.10_vite@3.0.4
vue-tsc: 0.38.2_typescript@4.7.4
vue-tsc: 0.39.4_typescript@4.7.4
packages/form:
specifiers:
@ -228,13 +228,13 @@ importers:
element-plus: ^2.2.6
lodash-es: ^4.17.21
moment: ^2.29.2
rimraf: ^3.0.2
sass: ^1.35.1
sortablejs: ^1.14.0
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
vue: ^3.2.37
vue-tsc: ^0.38.2
vue-tsc: ^0.39.4
dependencies:
'@element-plus/icons-vue': 2.0.6_vue@3.2.37
'@tmagic/utils': link:../utils
@ -251,23 +251,23 @@ importers:
'@vitejs/plugin-vue': 3.0.1_vite@3.0.4+vue@3.2.37
'@vue/compiler-sfc': 3.2.37
'@vue/test-utils': 2.0.0_vue@3.2.37
rimraf: 3.0.2
sass: 1.52.2
typescript: 4.7.4
vite: 3.0.4_sass@1.52.2
vite-plugin-dts: 0.9.10_vite@3.0.4
vue-tsc: 0.38.2_typescript@4.7.4
vue-tsc: 0.39.4_typescript@4.7.4
packages/schema:
specifiers:
'@types/node': ^15.12.4
rimraf: ^3.0.2
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
devDependencies:
'@types/node': 15.14.9
rimraf: 3.0.2
typescript: 4.7.4
vite: 3.0.4
vite-plugin-dts: 0.9.10_vite@3.0.4
packages/stage:
specifiers:
@ -283,10 +283,10 @@ importers:
lodash-es: ^4.17.21
moveable: ^0.30.0
moveable-helper: ^0.4.0
rimraf: ^3.0.2
sass: ^1.35.1
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
dependencies:
'@scena/guides': 0.17.0
'@tmagic/core': link:../core
@ -301,14 +301,15 @@ importers:
'@types/events': 3.0.0
'@types/lodash-es': 4.17.6
'@types/node': 15.14.9
rimraf: 3.0.2
sass: 1.52.2
typescript: 4.7.4
vite: 3.0.4_sass@1.52.2
vite-plugin-dts: 0.9.10_vite@3.0.4
packages/table:
specifiers:
'@tmagic/form': 1.1.0-beta.5
'@tmagic/utils': 1.1.0-beta.5
'@types/color': ^3.0.1
'@types/lodash-es': ^4.17.4
'@types/node': ^15.12.4
@ -317,14 +318,15 @@ importers:
'@vue/test-utils': ^2.0.0
element-plus: ^2.2.6
lodash-es: ^4.17.21
rimraf: ^3.0.2
sass: ^1.35.1
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
vue: ^3.2.37
vue-tsc: ^0.38.2
vue-tsc: ^0.39.4
dependencies:
'@tmagic/form': link:../form
'@tmagic/utils': link:../utils
element-plus: 2.2.6_vue@3.2.37
lodash-es: 4.17.21
vue: 3.2.37
@ -335,11 +337,11 @@ importers:
'@vitejs/plugin-vue': 3.0.1_vite@3.0.4+vue@3.2.37
'@vue/compiler-sfc': 3.2.37
'@vue/test-utils': 2.0.0_vue@3.2.37
rimraf: 3.0.2
sass: 1.52.2
typescript: 4.7.4
vite: 3.0.4_sass@1.52.2
vite-plugin-dts: 0.9.10_vite@3.0.4
vue-tsc: 0.38.2_typescript@4.7.4
vue-tsc: 0.39.4_typescript@4.7.4
packages/ui:
specifiers:
@ -413,17 +415,17 @@ importers:
'@tmagic/schema': 1.1.0-beta.5
'@types/node': ^15.12.4
moment: ^2.29.2
rimraf: ^3.0.2
typescript: ^4.7.4
vite: ^3.0.4
vite-plugin-dts: ^0.9.6
dependencies:
'@tmagic/schema': link:../schema
moment: 2.29.3
devDependencies:
'@types/node': 15.14.9
rimraf: 3.0.2
typescript: 4.7.4
vite: 3.0.4
vite-plugin-dts: 0.9.10_vite@3.0.4
playground:
specifiers:
@ -448,7 +450,7 @@ importers:
vite: ^3.0.4
vue: ^3.2.37
vue-router: ^4.0.10
vue-tsc: ^0.38.2
vue-tsc: ^0.39.4
dependencies:
'@element-plus/icons-vue': 2.0.6_vue@3.2.37
'@tmagic/editor': link:../packages/editor
@ -472,7 +474,7 @@ importers:
sass: 1.52.2
typescript: 4.7.4
vite: 3.0.4_sass@1.52.2+terser@5.14.2
vue-tsc: 0.38.2_typescript@4.7.4
vue-tsc: 0.39.4_typescript@4.7.4
runtime/react:
specifiers:
@ -577,7 +579,7 @@ importers:
typescript: ^4.3.4
vite: ^3.0.4
vue: ^3.2.37
vue-tsc: ^0.38.2
vue-tsc: ^0.39.4
dependencies:
'@tmagic/cli': link:../../packages/cli
'@tmagic/core': link:../../packages/core
@ -601,7 +603,7 @@ importers:
sass: 1.52.2
typescript: 4.7.4
vite: 3.0.4_sass@1.52.2+terser@5.14.2
vue-tsc: 0.38.2_typescript@4.7.4
vue-tsc: 0.39.4_typescript@4.7.4
packages:
@ -1441,15 +1443,6 @@ packages:
engines: {node: '>= 10'}
dev: true
/@ts-morph/common/0.12.3:
resolution: {integrity: sha512-4tUmeLyXJnJWvTFOKtcNJ1yh0a3SsTLi2MUoyj8iUNznFRN1ZquaNe7Oukqrnki2FzZkm0J9adCNLDZxUzvj+w==}
dependencies:
fast-glob: 3.2.11
minimatch: 3.1.2
mkdirp: 1.0.4
path-browserify: 1.0.1
dev: true
/@tsconfig/node10/1.0.8:
resolution: {integrity: sha512-6XFfSQmMgq0CFLY1MslA/CPUfhIL919M1rMsa5lP2P097N2Wd1sSX0tx1u4olM16fLNhtHZpRhedZJphNJqmZg==}
dev: true
@ -1794,36 +1787,50 @@ packages:
vue: 2.7.4
dev: true
/@volar/code-gen/0.38.2:
resolution: {integrity: sha512-H81I6d7rZB7teqL+zhK/Xz1v0/kKkUwkB0Aq6b4+BTCqcJeiZkoWxd0gFhrhWTnUoqiM83lhoTGo2vkvx5YagQ==}
/@volar/code-gen/0.39.4:
resolution: {integrity: sha512-2RoDdktnN5ovhJoL1NgxKwKhfgP2TzcKVWp8+1Lb67sZ+hvWRL5GjHGkvlPkS91cElpwuURUHnbNNDT+uEqXuA==}
dependencies:
'@volar/source-map': 0.38.2
'@volar/source-map': 0.39.4
dev: true
/@volar/source-map/0.38.2:
resolution: {integrity: sha512-DWcYbYt9SPwk0r4VmXk1F0v4X5+hCqH1JRkAWSeJymQyXCQ2OQDEbY2PF12a7y2qn4FUBD2gOba2TynAqI8ZFQ==}
/@volar/source-map/0.39.4:
resolution: {integrity: sha512-0zp7v0Ta1rZ2nKC4RcsU94Q/wJVVDWD0AJIqRGFU8rlEs2QO+RpBgotTL6wnKyJjyTzXxhcz/7AHUcwFs2oRnw==}
dev: true
/@volar/vue-code-gen/0.38.2:
resolution: {integrity: sha512-whLunD6phSGWBUHZKdTxeglrpzQu26ii8CRVapFdjfyMaVhQ7ESNeIAhkTVyg2ovOPc0PiDYPQEPzfWAADIWog==}
/@volar/typescript-faster/0.39.4:
resolution: {integrity: sha512-nVwTr1MSeUOjm+piJge3WW8PE+JyYbkfpEsf54P0e4P+8PUPHbGRIgr2TSpAh3802JSqg2SHCoDionECT5aXYw==}
dependencies:
'@volar/code-gen': 0.38.2
'@volar/source-map': 0.38.2
semver: 7.3.7
dev: true
/@volar/vue-code-gen/0.39.4:
resolution: {integrity: sha512-jQwweKAgtKhX7kDvsVcBRieyNtEywoxZFN+XTyPRvtY57Z2B7Ei9zQb/01n1l2lI+FPuskxaXdZKCn4txSKojQ==}
dependencies:
'@volar/code-gen': 0.39.4
'@volar/source-map': 0.39.4
'@vue/compiler-core': 3.2.37
'@vue/compiler-dom': 3.2.37
'@vue/shared': 3.2.37
dev: true
/@volar/vue-typescript/0.38.2:
resolution: {integrity: sha512-5IKvSK2m5yUmH6iu/tNScVlvJGuiHawTfSmjxaMs+/tod25WeK37LEdf+pdKtlJ30bYTQmmkAuEfG01QvvBRGQ==}
/@volar/vue-language-core/0.39.4:
resolution: {integrity: sha512-ua4HAT8VYSf3EgY4Fl/mfpOQcUWz3gokJ8qsGIGfgKq3MxORnpp+RzKOEpMo1q+Ic550i+x0fh6Ylde76zOLww==}
dependencies:
'@volar/code-gen': 0.38.2
'@volar/source-map': 0.38.2
'@volar/vue-code-gen': 0.38.2
'@volar/code-gen': 0.39.4
'@volar/source-map': 0.39.4
'@volar/vue-code-gen': 0.39.4
'@vue/compiler-sfc': 3.2.37
'@vue/reactivity': 3.2.37
dev: true
/@volar/vue-typescript/0.39.4:
resolution: {integrity: sha512-ZIWg8EvTq53+P4DQVlrW5y+bo5v9VTOASBTrojBo0yK2frNbv/Gs7Ml4V+NmlsvIggtrPtDC/hIQChFiS5B3SA==}
dependencies:
'@volar/code-gen': 0.39.4
'@volar/typescript-faster': 0.39.4
'@volar/vue-language-core': 0.39.4
dev: true
/@vue/babel-helper-vue-transform-on/1.0.2:
resolution: {integrity: sha512-hz4R8tS5jMn8lDq6iD+yWL6XNB699pGIVLk7WSJnn1dbpjaazsjZQkieJoRX6gW5zpYSCFqQ7jUquPNY65tQYA==}
@ -2746,12 +2753,6 @@ packages:
resolution: {integrity: sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==}
engines: {node: '>=0.8'}
/code-block-writer/11.0.0:
resolution: {integrity: sha512-GEqWvEWWsOvER+g9keO4ohFoD3ymwyCnqY3hoTr7GZipYFwEhMHJw+TtV0rfgRhNImM6QWZGO2XYjlJVyYT62w==}
dependencies:
tslib: 2.3.1
dev: true
/color-convert/1.9.3:
resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
dependencies:
@ -5258,12 +5259,6 @@ packages:
resolution: {integrity: sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==}
dev: true
/mkdirp/1.0.4:
resolution: {integrity: sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==}
engines: {node: '>=10'}
hasBin: true
dev: true
/modify-values/1.0.1:
resolution: {integrity: sha512-xV2bxeN6F7oYjZWTe/YPAy6MN2M+sL4u/Rlm2AHCIVGfo2p1yGmBHQ6vHehl4bRTZBdHu3TSkWdYgkwpYzAGSw==}
engines: {node: '>=0.10.0'}
@ -5564,10 +5559,6 @@ packages:
resolution: {integrity: sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==}
dev: true
/path-browserify/1.0.1:
resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==}
dev: true
/path-exists/3.0.0:
resolution: {integrity: sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==}
engines: {node: '>=4'}
@ -6580,13 +6571,6 @@ packages:
resolution: {integrity: sha512-+1iDGY6NmOGidq7i7xZGA4cm8DAa6fqdYcvO5Z6yBevH++Bdo9Qt/mN0TzHUgcCcKv1gmh9+W5dHqz8pMWbCbg==}
dev: true
/ts-morph/13.0.3:
resolution: {integrity: sha512-pSOfUMx8Ld/WUreoSzvMFQG5i9uEiWIsBYjpU9+TTASOeUa89j5HykomeqVULm1oqWtBdleI3KEFRLrlA3zGIw==}
dependencies:
'@ts-morph/common': 0.12.3
code-block-writer: 11.0.0
dev: true
/ts-node/10.8.1_7oqjshy4scgohh2k2lzivplbau:
resolution: {integrity: sha512-Wwsnao4DQoJsN034wePSg5nZiw4YKXf56mPIAeD6wVmiv+RytNSWqc2f3fKvcUoV+Yn2+yocD71VOfQHbmVX4g==}
hasBin: true
@ -6631,10 +6615,6 @@ packages:
resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}
dev: true
/tslib/2.3.1:
resolution: {integrity: sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==}
dev: true
/tslib/2.4.0:
resolution: {integrity: sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==}
@ -6770,18 +6750,6 @@ packages:
spdx-expression-parse: 3.0.1
dev: true
/vite-plugin-dts/0.9.10_vite@3.0.4:
resolution: {integrity: sha512-dNfFJXRsm3YW8k+Wm8SesSaEGOaicKdgFz5PoUpT9zUh6URr5cwu5NMOBhJgiofrzcuYtOU2Ez7JQtg68RII8g==}
engines: {node: '>=12.0.0'}
peerDependencies:
vite: '>=2.4.4'
dependencies:
fast-glob: 3.2.11
fs-extra: 10.1.0
ts-morph: 13.0.3
vite: 3.0.4
dev: true
/vite/2.9.14:
resolution: {integrity: sha512-P/UCjSpSMcE54r4mPak55hWAZPlyfS369svib/gpmz8/01L822lMPOJ/RYW6tLCe1RPvMvOsJ17erf55bKp4Hw==}
engines: {node: '>=12.2.0'}
@ -7009,13 +6977,14 @@ packages:
he: 1.2.0
dev: true
/vue-tsc/0.38.2_typescript@4.7.4:
resolution: {integrity: sha512-+OMmpw9BZC9khul3I1HGtWchv7BCiaM7NvfdilVAiOFkjnivIoaW6jJm6YPQJaEPouePtpkDUWovyzgNxWdDsw==}
/vue-tsc/0.39.4_typescript@4.7.4:
resolution: {integrity: sha512-oGFuAdSt8Q1NatnyyJheW0P/8Sk9RDMWPNzeMHXl1OOnoXrbjz2miMcccujySCpA48+AhzdtyFY1PL0XTPsOSg==}
hasBin: true
peerDependencies:
typescript: '*'
dependencies:
'@volar/vue-typescript': 0.38.2
'@volar/vue-language-core': 0.39.4
'@volar/vue-typescript': 0.39.4
typescript: 4.7.4
dev: true

2
runtime/vue3/package.json
View File

@ -39,6 +39,6 @@
"sass": "^1.35.1",
"typescript": "^4.3.4",
"vite": "^3.0.4",
"vue-tsc": "^0.38.2"
"vue-tsc": "^0.39.4"
}
}

17
tsconfig.json
View File

@ -1,10 +1,10 @@
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"target": "ESNext",
"module": "ESNext",
"strict": true,
"jsx": "preserve",
"moduleResolution": "node",
"moduleResolution": "Node",
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
@ -13,13 +13,9 @@
"emitDecoratorMetadata": true,
"resolveJsonModule": true,
"sourceMap": true,
"useDefineForClassFields": true,
"baseUrl": ".",
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
],
"lib": ["ESNext", "DOM"],
"paths": {
// 内部模块都指向 src/index.ts, 会有更好的代码跳转体验.
"@tmagic/*": ["packages/*/src"],
@ -31,6 +27,7 @@
],
},
"exclude": [
"**/dist/**/*"
"**/dist/**/*",
"**/node_modules/**/*",
],
}