fix: genCode favicon can't work on node runtime (#1000)

packages/vue-generator/src/templates/vue-template/index.js

@@ -33,6 +33,8 @@ const getTemplate = (schema, str) => {
   })
 }
 
+const isBrowser = typeof window !== 'undefined' && typeof window.document !== 'undefined'
+
 /**
  * 图片的 base64 转 Blob 对象，用于生成本地图片
  * @param {*} base64 String
@@ -54,7 +56,11 @@ const base64ToBlob = (base64Data) => {
   let raw
 
   try {
-    raw = window.atob(arr[1])
+    if (isBrowser) {
+      raw = window.atob(arr[1])
+    } else {
+      raw = Buffer.from(arr[1], 'base64').toString('binary')
+    }
   } catch (e) {
     throw new Error('Failed to decode base64 string')
   }
@@ -160,21 +166,18 @@ export function generateTemplate(schema) {
     }
   ]
 
-  // FIXME: vitest 测试的时候得到的并不是 base64data，所以这里需要跳过文件的出码
-  if (process.env?.NODE_ENV !== 'test') {
-    try {
-      const faviconData = base64ToBlob(logoImage)
+  try {
+    const faviconData = base64ToBlob(logoImage)
 
-      res.push({
-        fileType: 'image/x-icon',
-        fileName: 'favicon.ico',
-        path: './public',
-        fileContent: faviconData
-      })
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.error('generate favicon.ico error', error)
-    }
+    res.push({
+      fileType: 'image/x-icon',
+      fileName: 'favicon.ico',
+      path: './public',
+      fileContent: faviconData
+    })
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.error('generate favicon.ico error', error)
   }
 
   return res

packages/vue-generator/test/testcases/generator/generateApp.test.js

@@ -1,11 +1,22 @@
-import { expect, test, describe } from 'vitest'
+import { expect, test, describe, vi } from 'vitest'
 import path from 'path'
 import fs from 'fs'
 import dirCompare from 'dir-compare'
 import { generateApp } from '@/generator/generateApp'
 import { appSchemaDemo01 } from './mockData'
 import { logDiffResult } from '../../utils/logDiffResult'
 
+// 需要模拟 import 出来的 favicon.ico 文件， base64 格式，因为在 test 运行环境中直接的 import 出来的不是 bast64 字符串，而是路径
+vi.mock('../../../src/templates/vue-template/templateFiles/public/favicon.ico', () => {
+  const faviconRelativePath = '../../../src/templates/vue-template/templateFiles/public/favicon.ico'
+  const fileBuffer = fs.readFileSync(path.join(__dirname, faviconRelativePath))
+  const str = fileBuffer.toString('base64')
+
+  return {
+    default: `data:image/x-icon;base64,${str}`
+  }
+})
+
 describe('generate whole application', () => {
   test('should not throw error', async () => {
     const instance = generateApp()
@@ -14,14 +25,22 @@ describe('generate whole application', () => {
     const { genResult } = res
 
     // 写入文件
-    genResult.forEach(({ fileName, path: filePath, fileContent }) => {
+    for (const { fileName, path: filePath, fileContent } of genResult) {
       fs.mkdirSync(path.resolve(__dirname, `./result/appdemo01/${filePath}`), { recursive: true })
-      fs.writeFileSync(
-        path.resolve(__dirname, `./result/appdemo01/${filePath}/${fileName}`),
-        // 这里需要将换行符替换成 CRLF 格式的
-        fileContent.replace(/\r?\n/g, '\r\n')
-      )
-    })
+
+      if (typeof fileContent === 'string') {
+        fs.writeFileSync(
+          path.resolve(__dirname, `./result/appdemo01/${filePath}/${fileName}`),
+          // 这里需要将换行符替换成 CRLF 格式的
+          fileContent.replace(/\r?\n/g, '\r\n')
+        )
+      } else if (fileContent instanceof Blob) {
+        const arrayBuffer = await fileContent.arrayBuffer()
+        const buffer = Buffer.from(arrayBuffer)
+
+        fs.writeFileSync(path.resolve(__dirname, `./result/appdemo01/${filePath}/${fileName}`), buffer)
+      }
+    }
 
     const compareOptions = {
       compareContent: true,