fix(icons): add rewrite icons export ,rename subscript to sub-script (#3857)

Author: shenjunjian

internals/automate/src/build-svg-to-js/config.ts

@@ -2,4 +2,6 @@
 export const svgsPath = '../../packages/theme/src/svgs'
 export const iconsPath = '../../packages/vue-icon'
 
-export const rewriteConfig = {}
+export const rewriteConfig = {
+  'subscript': 'sub-script'
+}

internals/automate/src/build-svg-to-js/index.ts

@@ -38,7 +38,6 @@ import * as configSaas from './config-saas'
 interface FileInfo {
   svgName: string
   hasFill: boolean
-  rewriteName: string // hasFill：true时， 不应该有rewriteName
 }
 const camelize = (str) => str.replace(/-(\w)/g, (_, c) => (c ? c.toUpperCase() : ''))
 const isSaas = process.argv.includes('--icon-saas')
@@ -64,10 +63,10 @@ svgsFiles.forEach((filename) => {
 
   if (filename.endsWith('-filled.svg')) {
     svgName = filename.replace('-filled.svg', '')
-    item = { svgName, hasFill: true, rewriteName: rewriteConfig[svgName] }
+    item = { svgName, hasFill: true }
   } else if (filename.endsWith('.svg')) {
     svgName = filename.replace('.svg', '')
-    item = { svgName, hasFill: false, rewriteName: rewriteConfig[svgName] }
+    item = { svgName, hasFill: false }
   } else {
     return
   }
@@ -80,23 +79,23 @@ svgsFiles.forEach((filename) => {
 })
 
 // 2、生成组件的js
-const rewriteList: { capName: string; svgName: string; rewriteName: string }[] = []
 const fillList: { capName: string; svgName: string }[] = []
 const uncheckedList: { capName: string; svgName: string }[] = []
+const rewriteList = Object.keys(rewriteConfig).map((wrongName) => {
+  return {
+    capName: camelize('-' + wrongName),
+    svgName: wrongName,
+    rewriteName: camelize('-' + rewriteConfig[wrongName])
+  }
+})
 
 Object.values(svgsMap).forEach((item) => {
   const capName = camelize('-' + item.svgName)
 
-  // 重命名的图标
-  if (item.rewriteName) {
-    rewriteList.push({ capName, svgName: item.svgName, rewriteName: camelize('-' + item.rewriteName) })
-    return
-  }
   // 支持线&面的图标
   if (item.hasFill) {
     fillList.push({ capName, svgName: item.svgName })
-    const tmplStr = `
-import { svg } from '@opentiny/vue-common'
+    const tmplStr = `import { svg } from '@opentiny/vue-common'
 import ${capName} from '${themePackage}/svgs/${item.svgName}.svg'
 import ${capName}Filled from '${themePackage}/svgs/${item.svgName + '-filled'}.svg'
 
@@ -108,8 +107,7 @@ export default () => svg({ name: 'Icon${capName}', component: ${capName}, filled
   }
   // 未梳理到的图标
   uncheckedList.push({ capName, svgName: item.svgName })
-  const tmplStr = `
-import { svg } from '@opentiny/vue-common'
+  const tmplStr = `import { svg } from '@opentiny/vue-common'
 import ${capName} from '${themePackage}/svgs/${item.svgName}.svg'
 
 export default () => svg({ name: 'Icon${capName}', component: ${capName}, filledComponent: ${capName} })()
@@ -160,20 +158,6 @@ fs.writeFileSync(`${iconsPath}/index.ts`, tmplStr, 'utf-8')
 
 // 4、打印日志
 
-// 即是 hasFill, 但配置了 rewriteName, 请从config.ts中移除相应的rewrite。
-// 因为要求设计师那边已经去重过了，
-const err1 = Object.values(svgsMap)
-  .filter((item) => item.hasFill && item.rewriteName)
-  .map((item) => item.svgName)
-
-if (err1.length) {
-  console.error(`
-********即是 hasFill, 但配置了 rewriteName, 请从config.ts中移除相应的rewrite**********
-${err1.join(',')}
-************************************************************************************
-`)
-}
-
 // 非 hasFill, 且未配置 rewriteName, 大概是未梳理到的历史图标,tiny图标
 const err2 = uncheckedList.map((item) => item.svgName)
 if (err2.length) {

packages/theme/src/svgs/subscript.svg packages/theme/src/svgs/sub-script.svgpackages/theme/src/svgs/subscript.svg renamed to packages/theme/src/svgs/sub-script.svg

@@ -1164,6 +1164,14 @@ export { IconWord, IconWord as iconWord }
 export { IconZip, IconZip as iconZip }
 
 // 重命名导出
+export const IconTotalNolume = () => ({
+  ...IconTotalVolume(),
+  name: 'IconTotalNolume',
+  deprecatedBy: 'IconTotalVolume'
+})
+export const iconTotalNolume = IconTotalNolume
+export const IconSubscript = () => ({ ...IconSubScript(), name: 'IconSubscript', deprecatedBy: 'IconSubScript' })
+export const iconSubscript = IconSubscript
 
 export default {
   IconAcceptance,
@@ -1745,5 +1753,7 @@ export default {
   IconWarning,
   IconWeaknet,
   IconWord,
-  IconZip
+  IconZip,
+  IconTotalNolume,
+  IconSubscript
 }

packages/vue-icon-saas/index.ts

@@ -2,5 +2,4 @@ import { svg } from '@opentiny/vue-common'
 import SubScript from '@opentiny/vue-theme-saas/svgs/sub-script.svg'
 import SubScriptFilled from '@opentiny/vue-theme-saas/svgs/sub-script-filled.svg'
 
-// TODO: 文件名和组件名已统一改为 subscript，此文件应该删除
 export default () => svg({ name: 'IconSubScript', component: SubScript, filledComponent: SubScriptFilled })()

packages/vue-icon-saas/src/sub-script.ts

@@ -460,7 +460,7 @@ import IconStreamSolid from './src/stream-solid'
 import IconStretchCrosswise from './src/stretch-crosswise'
 import IconStretchUpright from './src/stretch-upright'
 import IconStretch from './src/stretch'
-import IconSubscript from './src/subscript'
+import IconSubScript from './src/sub-script'
 import IconSubstituteMaterial from './src/substitute-material'
 import IconSuccess from './src/success'
 import IconSuccessful from './src/successful'
@@ -999,7 +999,7 @@ export { IconStreamSolid, IconStreamSolid as iconStreamSolid }
 export { IconStretchCrosswise, IconStretchCrosswise as iconStretchCrosswise }
 export { IconStretchUpright, IconStretchUpright as iconStretchUpright }
 export { IconStretch, IconStretch as iconStretch }
-export { IconSubscript, IconSubscript as iconSubscript }
+export { IconSubScript, IconSubScript as iconSubScript }
 export { IconSubstituteMaterial, IconSubstituteMaterial as iconSubstituteMaterial }
 export { IconSuccess, IconSuccess as iconSuccess }
 export { IconSuccessful, IconSuccessful as iconSuccessful }
@@ -1074,6 +1074,8 @@ export { IconZoomIn, IconZoomIn as iconZoomIn }
 export { IconZoomOut, IconZoomOut as iconZoomOut }
 
 // 重命名导出
+export const IconSubscript = () => ({ ...IconSubScript(), name: 'IconSubscript', deprecatedBy: 'IconSubScript' })
+export const iconSubscript = IconSubscript
 
 export default {
   IconEditorEraser,
@@ -1538,7 +1540,7 @@ export default {
   IconStretchCrosswise,
   IconStretchUpright,
   IconStretch,
-  IconSubscript,
+  IconSubScript,
   IconSubstituteMaterial,
   IconSuccess,
   IconSuccessful,
@@ -1610,5 +1612,6 @@ export default {
   IconYes,
   IconZipType,
   IconZoomIn,
-  IconZoomOut
+  IconZoomOut,
+  IconSubscript
 }

packages/vue-icon-saas/src/subscript.ts

@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import SubScript from '@opentiny/vue-theme/svgs/sub-script.svg'
+
+export default () => svg({ name: 'IconSubScript', component: SubScript, filledComponent: SubScript })()