Home Explore Help
Register Sign In
Saas
/
customform
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

fix: 简化打包每次都要压缩问题

huangziyang 3 days ago
parent
77625b6b45
commit
4f2bcc558a
15 changed files with 554 additions and 83 deletions
Split View Show Diff Stats
  1. 2 0
      .gitignore
  2. BIN
      form.zip
  3. 5 5
      form/index.html
  4. 0 4
      form/static/.pnpm.ZhcTz5Wm.js
  5. 0 7
      form/static/@form-create/designer.Bw0zwQqi.js
  6. 0 0
      form/static/element-plus.K6A-vihL.js
  7. 0 0
      form/static/index.35ei16Lw.js
  8. 0 1
      form/static/index.BSjPPZKB.css
  9. 5 2
      package.json
  10. 459 3
      pnpm-lock.yaml
  11. 55 0
      scripts/build.js
  12. 24 25
      src/App.vue
  13. 1 34
      src/components/H5-form/H5-form.vue
  14. 3 1
      src/form.config.ts
  15. 0 1
      src/main.ts

+ 2 - 0
.gitignore
View File 

@@ -14,6 +14,8 @@ dist-ssr
 
 coverage
 
 *.local
 
 
+form
 
+
 
 /cypress/videos/
 
 /cypress/screenshots/

BIN
form.zip
View File


+ 5 - 5
form/index.html
View File 

@@ -3,7 +3,7 @@
 
     <link rel="icon" href="/favicon.ico">
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <title>Vite App</title>
 
-    <script crossorigin="">import('/static/index.35ei16Lw.js').finally(() => {
 
+    <script crossorigin="">import('/static/index.Dmzf96Bk.js').finally(() => {
 
             
     const qiankunLifeCycle = window.moudleQiankunAppLifeCycles && window.moudleQiankunAppLifeCycles['curstom-form'];
 
     if (qiankunLifeCycle) {
 
@@ -14,12 +14,12 @@
 
     }
 
   
           })</script>
 
-    <link rel="modulepreload" crossorigin="" href="/static/.pnpm.ZhcTz5Wm.js">
 
+    <link rel="modulepreload" crossorigin="" href="/static/.pnpm.CRLYFuod.js">
 
     <link rel="modulepreload" crossorigin="" href="/static/lodash-es.C-xrcuFl.js">
 
-    <link rel="modulepreload" crossorigin="" href="/static/element-plus.K6A-vihL.js">
 
-    <link rel="modulepreload" crossorigin="" href="/static/@form-create/designer.Bw0zwQqi.js">
 
+    <link rel="modulepreload" crossorigin="" href="/static/element-plus.Dozcb0Co.js">
 
+    <link rel="modulepreload" crossorigin="" href="/static/@form-create/designer.BQ8hZRqe.js">
 
     <link rel="stylesheet" crossorigin="" href="/static/element-plus.D92rDM1h.css">
 
-    <link rel="stylesheet" crossorigin="" href="/static/index.BSjPPZKB.css">
 
+    <link rel="stylesheet" crossorigin="" href="/static/index.nPkbAqeq.css">
 
   </head>
 
   <body>
 
     <div id="app"></div>

File diff suppressed because it is too large
+ 0 - 4
form/static/.pnpm.ZhcTz5Wm.js


File diff suppressed because it is too large
+ 0 - 7
form/static/@form-create/designer.Bw0zwQqi.js


File diff suppressed because it is too large
+ 0 - 0
form/static/element-plus.K6A-vihL.js


File diff suppressed because it is too large
+ 0 - 0
form/static/index.35ei16Lw.js


+ 0 - 1
form/static/index.BSjPPZKB.css
View File 

@@ -1 +0,0 @@
 
-*{margin:0;padding:0}.image[data-v-512df0dc]{width:100%}.options-container{display:flex;flex-direction:column;gap:10px}.options{display:flex;align-items:center;gap:10px}.tags{display:flex;gap:5px}.dialog-footer[data-v-61045a6c]{width:100%;display:flex;justify-content:flex-end;gap:10px;align-items:center}.rc-switch[data-v-61045a6c]{display:flex;flex-direction:column}.edit[data-v-61045a6c]{display:flex;align-items:center;gap:10px}.aaatip[data-v-61045a6c]{color:#999}.t[data-v-61045a6c]{display:flex;gap:10px;background-color:#f1f8fe;padding:10px;align-items:center}.body[data-v-61045a6c]{margin:20px}.tags[data-v-61045a6c]{display:flex;flex-direction:column;gap:10px;margin-top:20px}.title[data-v-61045a6c]{font-weight:600;font-size:16px}

+ 5 - 2
package.json
View File 

@@ -5,8 +5,8 @@
 
   "type": "module",
 
   "scripts": {
 
     "dev": "vite --mode dev",
 
-    "build": "vite build --mode release",
 
-    "build:prod": "vite build --mode prod",
 
+    "build": "node ./scripts/build mode=test",
 
+    "build:prod": "node ./scripts/build mode=prod",
 
     "preview": "vite preview",
 
     "type-check": "vue-tsc --build",
 
     "lint": "eslint . --fix",
 
@@ -30,10 +30,13 @@
 
     "@vue/eslint-config-prettier": "^10.2.0",
 
     "@vue/eslint-config-typescript": "^14.5.0",
 
     "@vue/tsconfig": "^0.7.0",
 
+    "archiver": "^7.0.1",
 
     "eslint": "^9.22.0",
 
     "eslint-plugin-vue": "~10.0.0",
 
+    "execa": "^9.6.0",
 
     "jiti": "^2.4.2",
 
     "npm-run-all2": "^7.0.2",
 
+    "ora": "^8.2.0",
 
     "prettier": "3.5.3",
 
     "typescript": "~5.8.0",
 
     "vite": "^6.3.5",

File diff suppressed because it is too large
+ 459 - 3
pnpm-lock.yaml


+ 55 - 0
scripts/build.js
View File 

@@ -0,0 +1,55 @@
 
+import ora from 'ora'
 
+import fs from 'fs'
 
+import archiver from 'archiver'
 
+import { execa } from 'execa'
 
+
 
+async function runTask(taskName, task) {
 
+  const s = ora().start(`${taskName} 开始打包 `)
 
+  try {
 
+    await task()
 
+    s.succeed(`${taskName} 打包完成!`)
 
+  } catch (e) {
 
+    s.fail(`${taskName} 打包失败!`)
 
+    console.error(`失败原因：${e.toString()}`)
 
+  }
 
+}
 
+const envMap = {
 
+  dev: '开发环境',
 
+  test: '测试环境',
 
+  prod: '生产环境',
 
+}
 
+const map = {}
 
+process.env.npm_lifecycle_script
 
+  .split(' ')
 
+  .filter((i) => i.includes('='))
 
+  .map((obj) => {
 
+    const [key, value] = obj.split('=')
 
+    map[key] = value
 
+  })
 
+
 
+const buildPlatform = async () => {
 
+  await execa('vite', ['build', '--mode', map.mode])
 
+}
 
+
 
+;(async () => {
 
+  fs.rmSync('form.zip', { recursive: true, force: true })
 
+  await runTask(`自定义表单${envMap[map.mode]}`, buildPlatform)
 
+  const zipDirectory = () => {
 
+    // 1. 创建 ZIP 写入流
 
+    const output = fs.createWriteStream('form.zip')
 
+    const archive = archiver('zip', { zlib: { level: 9 } }) // 最高压缩率
 
+
 
+    // 2. 监听错误
 
+    output.on('close', () => console.log(`ZIP 打包完成，大小：${archive.pointer()} 字节`))
 
+    archive.on('error', (err) => console.error('压缩失败:', err))
 
+
 
+    // 3. 关联输出流
 
+    archive.pipe(output)
 
+
 
+    // 4. 添加文件/目录
 
+    archive.directory('form/', true)
 
+    // 5. 完成压缩
 
+    archive.finalize()
 
+  }
 
+  await runTask('zip', zipDirectory)
 
+})()

+ 24 - 25
src/App.vue
View File 

@@ -1,3 +1,4 @@
 
+<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 
 <!-- eslint-disable @typescript-eslint/no-explicit-any -->
 
 <script setup lang="ts">
 
 import { ref, onMounted } from 'vue'
 
@@ -10,7 +11,7 @@ import { RcRadio } from './plugins/components/rc-radio.config.ts'
 
 import { RcCheckbox } from './plugins/components/rc-checkbox.config.ts'
 
 // 菜单
 
 import { MenuOptions } from './plugins/menu/options.ts'
 
-
 
+// @ts-expect-error
 
 import type { FcDesignerInstance } from '@form-create/designer' // 注册组件
 
 import type { Options, Rule } from '@form-create/element-ui'
 
 import type { Option } from './components/rc-options/createOptions.ts'
 
@@ -23,6 +24,7 @@ declare global {
 
     __QIANKUN__EVENT__: {
 
       on: (name: string, fn: (...arg: any[]) => void) => void
 
       emit: (name: string, ...arg: any[]) => boolean
 
+      off: (name: string, fn?: (...arg: any[]) => void) => void
 
     } // 事件中心
 
     __QIANKUN__REQUSET__: any // 请求API接口
 
     __QIANKUN__GUID__: () => string // 获取唯一标识
 
@@ -57,37 +59,34 @@ const onSave = async (config: { options: string; rule: string }) => {
 
   })
 
 }
 
 
-window.__QIANKUN__EVENT__.on('formCoverChange', (cover: string) => {
 
-  const newRule = designer.value!.getRule() as Rule[]
 
-  if (!cover) {
 
-    newRule.shift()
 
-    designer.value?.setRule(newRule)
 
-    return
 
-  }
 
-  const firstType = newRule[0]?.type
 
-  if (firstType === 'rc-image') {
 
-    newRule[0]!.props!.cover = cover
 
-  } else {
 
-    newRule.unshift({
 
-      type: 'rc-image',
 
-      props: {
 
-        cover,
 
-      },
 
-    } as Rule)
 
-  }
 
-
 
-  designer.value?.setRule(JSON.stringify(newRule)) // 重新赋值
 
-})
 
-
 
 onMounted(async () => {
 
-  console.log(window.__QIANKUN__EVENT__)
 
-
 
   // 注册拖拽规则
 
   designer.value?.addMenu(MenuOptions)
 
   designer.value?.addComponent(RcSelect)
 
   designer.value?.addComponent(RcRadio)
 
   designer.value?.addComponent(RcCheckbox)
 
+  const des = designer.value
 
+  window.__QIANKUN__EVENT__.on('formCoverChange', (cover: string) => {
 
+    const newRule = des?.getRule() as Rule[]
 
+    if (!cover) {
 
+      newRule.shift()
 
+      des?.setRule(newRule)
 
+      return
 
+    }
 
+    const firstType = newRule[0]?.type
 
+    if (firstType === 'rc-image') {
 
+      newRule[0]!.props!.cover = cover
 
+    } else {
 
+      newRule.unshift({
 
+        type: 'rc-image',
 
+        props: {
 
+          cover,
 
+        },
 
+      } as Rule)
 
+    }
 
 
+    des?.setRule(JSON.stringify(newRule)) // 重新赋值
 
+  })
 
   id = location.search?.substring(1).split('=')[1] || ''
 
   if (!id) return

+ 1 - 34
src/components/H5-form/H5-form.vue
View File 

@@ -3,7 +3,7 @@
 
 import { request } from '@/utils/request'
 
 import { onMounted, ref } from 'vue'
 
 import { renderMap, type CustomerOptions } from './H5-form'
 
-import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
 
+import { type FormInstance, type FormRules } from 'element-plus'
 
 
 const customerOptions = ref<CustomerOptions>({} as CustomerOptions)
 
 const ruleFormRef = ref<FormInstance>()
 
@@ -13,38 +13,6 @@ const loading = ref(false)
 
 
 const hasOptions = (type: string) => type === 'select' || type === 'checkbox' || type === 'radio'
 
 
-const onSubmit = async (formEl: FormInstance | undefined) => {
 
-  // 预览不需要提交
 
-  console.log(formEl, ElMessage)
 
-
 
-  // loading.value = true
 
-  // if (!formEl) return
 
-  // const result = []
 
-  // for (const field_name in defaultValue.value) {
 
-  //   if (field_name in rules.value) {
 
-  //     if (defaultValue.value[field_name] === '' || defaultValue.value[field_name] === undefined) {
 
-  //       loading.value = false
 
-  //       ElMessage.error('请填写' + field_name)
 
-  //       return
 
-  //     }
 
-  //   }
 
-  //   const item = customerOptions.value.form_field.find((item) => item.field_name === field_name)
 
-  //   result.push({
 
-  //     field_name,
 
-  //     field_content: defaultValue.value[field_name],
 
-  //     field_type: item?.props?.type || item?.field_type,
 
-  //   })
 
-  // }
 
-  // request({
 
-  //   method: 'post',
 
-  //   url: '/customer_form/submit_data',
 
-  //   data: {
 
-  //     submit_data: result,
 
-  //   },
 
-  // })
 
-  // loading.value = false
 
-}
 
-
 
 onMounted(async () => {
 
   const id = location.search?.substring(1).split('=')[1] || ''
 
   if (!id) return
 
@@ -115,7 +83,6 @@ onMounted(async () => {
 
         <el-button
 
           type="primary"
 
           style="width: 100%"
 
-          @click="onSubmit(ruleFormRef)"
 
           :loading="loading"
 
           >提交</el-button
 
         >

+ 3 - 1
src/form.config.ts
View File 

@@ -189,10 +189,12 @@ const formatOptions = (result: any) => {
 
     options: result.original.options,
 
     form_content: result.rule
 
       .map((item: any) => {
 
+        console.log(item)
 
+
 
         const formContentValue = {
 
           field_name: item.title, // 字段名称
 
           field_type: item.type.startsWith('rc-') ? item.type.substring(3) : item.type, // rc- 前缀
 
-          default_text: item.value, // 默认文本
 
+          default_text: item.value || '', // 默认文本
 
           is_required: item.$required ? 1 : 0, // 是否必填
 
           field_options: item.options?.map((op: any) => ({
 
             count: 0,

+ 0 - 1
src/main.ts
View File 

@@ -67,6 +67,5 @@ if (qiankunWindow.__POWERED_BY_QIANKUN__) {
 
   initQianKun()
 
 } else {
 
   // 独立运行时，直接挂载应用
 
-
 
   bootstrapVue3(H5_Form)
 
 }

Some files were not shown because too many files changed in this diff