feat: 优化组件导入方式,使用异步组件加载monaco.js

This commit is contained in:
zhanghao 2026-08-26 08:45:27 +08:00
parent 18249720f4
commit dbe6058000
5 changed files with 23 additions and 18 deletions

View File

@ -27,23 +27,22 @@
</template>
<script setup>
import { ref, computed } from 'vue'
import { computed, defineAsyncComponent, ref } from 'vue'
import { emitter } from '@/utils/eventBus'
// 导入各子组件
import StartParams from './params/StartParams.vue'
import BasicNodeParams from './params/BasicNodeParams.vue'
import CodeNodeParams from './params/CodeNodeParams.vue'
import HttpNodeParams from './params/HttpNodeParams.vue'
import SdAgentNodeParams from './params/SdAgentNodeParams.vue'
import RecognizeNodeParams from './params/RecognizeNodeParams.vue'
import DeviceUniversal from './params/DeviceUniversal.vue'
import SwitchNodeParams from './params/SwitchNodeParams.vue'
import ActionQueueParams from './params/ActionQueueParams.vue'
import MediaAnalysisParams from './params/MediaAnalysisParams.vue'
import ImageAnalysisParams from './params/ImageAnalysisParams.vue'
import EndParams from './params/EndParams.vue'
import SubFlowParams from './params/SubFlowParams.vue'
const StartParams = defineAsyncComponent(() => import('./params/StartParams.vue'))
const BasicNodeParams = defineAsyncComponent(() => import('./params/BasicNodeParams.vue'))
const CodeNodeParams = defineAsyncComponent(() => import('./params/CodeNodeParams.vue'))
const HttpNodeParams = defineAsyncComponent(() => import('./params/HttpNodeParams.vue'))
const SdAgentNodeParams = defineAsyncComponent(() => import('./params/SdAgentNodeParams.vue'))
const RecognizeNodeParams = defineAsyncComponent(() => import('./params/RecognizeNodeParams.vue'))
const DeviceUniversal = defineAsyncComponent(() => import('./params/DeviceUniversal.vue'))
const SwitchNodeParams = defineAsyncComponent(() => import('./params/SwitchNodeParams.vue'))
const ActionQueueParams = defineAsyncComponent(() => import('./params/ActionQueueParams.vue'))
const MediaAnalysisParams = defineAsyncComponent(() => import('./params/MediaAnalysisParams.vue'))
const ImageAnalysisParams = defineAsyncComponent(() => import('./params/ImageAnalysisParams.vue'))
const EndParams = defineAsyncComponent(() => import('./params/EndParams.vue'))
const SubFlowParams = defineAsyncComponent(() => import('./params/SubFlowParams.vue'))
const props = defineProps({
drawer: Boolean,

View File

@ -197,7 +197,7 @@
import { ref, reactive, watch, nextTick, onBeforeUnmount, onMounted } from 'vue'
import { Plus, Minus } from '@element-plus/icons-vue'
import FormItemRecursive from '../FormItemRecursive.vue'
import * as monaco from 'monaco-editor';
import * as monaco from '../../monaco.js'
import { getInput } from '@/utils/flow'
import { useQuote } from './useQuote.js'

View File

@ -202,7 +202,7 @@ import { ref, reactive, watch, nextTick, onBeforeUnmount, onMounted } from 'vue'
import { Plus, Minus } from '@element-plus/icons-vue'
import FormItemRecursive from '../FormItemRecursive.vue'
import RobotExecutionTarget from './RobotExecutionTarget.vue'
import * as monaco from 'monaco-editor';
import * as monaco from '../../monaco.js'
import { getInput } from '@/utils/flow'
import { useQuote } from './useQuote.js'
import { ElMessage } from 'element-plus'

View File

@ -338,7 +338,7 @@
import { ref, reactive, watch, nextTick, onMounted, onBeforeUnmount } from 'vue'
import { Plus, Minus } from '@element-plus/icons-vue'
import FormItemRecursive from '../FormItemRecursive.vue'
import * as monaco from 'monaco-editor';
import * as monaco from '../../monaco.js'
import { getInput, transformHttpNodeData } from '@/utils/flow'
import { useQuote } from './useQuote.js'

6
src/views/flow/monaco.js Normal file
View File

@ -0,0 +1,6 @@
import 'monaco-editor/esm/vs/editor/editor.all.js'
import 'monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution.js'
import 'monaco-editor/esm/vs/language/json/monaco.contribution.js'
import 'monaco-editor/esm/vs/language/typescript/monaco.contribution.js'
export * from 'monaco-editor/esm/vs/editor/editor.api.js'