build-icons.mjs 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. import fs from 'fs-extra'
  2. import path from 'path'
  3. import { PACKAGES_DIR, readSvgs } from './helpers.mjs'
  4. import { stringify } from 'svgson'
  5. import prettier from 'prettier'
  6. import bundleSize from '@atomico/rollup-plugin-sizes'
  7. import { visualizer } from 'rollup-plugin-visualizer'
  8. import license from 'rollup-plugin-license'
  9. import esbuild from 'rollup-plugin-esbuild'
  10. /**
  11. * Build icons
  12. *
  13. * @param name
  14. * @param componentTemplate
  15. * @param indexIconTemplate
  16. * @param typeDefinitionsTemplate
  17. * @param indexTypeTemplate
  18. * @param extension
  19. * @param pretty
  20. */
  21. export const buildIcons = ({
  22. name,
  23. componentTemplate,
  24. indexItemTemplate,
  25. typeDefinitionsTemplate,
  26. indexTypeTemplate,
  27. extension = 'js',
  28. pretty = true,
  29. key = true,
  30. pascalCase = false
  31. }) => {
  32. const DIST_DIR = path.resolve(PACKAGES_DIR, name),
  33. svgFiles = readSvgs()
  34. let index = []
  35. let typings = []
  36. svgFiles.forEach((svgFile, i) => {
  37. const children = svgFile.obj.children
  38. .map(({
  39. name,
  40. attributes
  41. }, i) => {
  42. if (key) {
  43. attributes.key = `svg-${i}`
  44. }
  45. if(pascalCase) {
  46. attributes.strokeWidth = attributes['stroke-width']
  47. delete attributes['stroke-width']
  48. }
  49. return [name, attributes]
  50. })
  51. .filter((i) => {
  52. const [name, attributes] = i
  53. return !attributes.d || attributes.d !== 'M0 0h24v24H0z'
  54. })
  55. // process.stdout.write(`Building ${i}/${svgFiles.length}: ${svgFile.name.padEnd(42)}\r`)
  56. let component = componentTemplate({
  57. name: svgFile.name,
  58. namePascal: svgFile.namePascal,
  59. children,
  60. stringify,
  61. svg: svgFile
  62. })
  63. const output = pretty ? prettier.format(component, {
  64. singleQuote: true,
  65. trailingComma: 'all',
  66. parser: 'babel'
  67. }) : component
  68. let filePath = path.resolve(DIST_DIR, 'src/icons', `${svgFile.namePascal}.${extension}`)
  69. fs.writeFileSync(filePath, output, 'utf-8')
  70. index.push(indexItemTemplate({
  71. name: svgFile.name,
  72. namePascal: svgFile.namePascal
  73. }))
  74. typings.push(indexTypeTemplate({
  75. name: svgFile.name,
  76. namePascal: svgFile.namePascal
  77. }))
  78. })
  79. fs.writeFileSync(path.resolve(DIST_DIR, `./src/icons.js`), index.join('\n'), 'utf-8')
  80. fs.ensureDirSync(path.resolve(DIST_DIR, `./dist/`))
  81. fs.writeFileSync(path.resolve(DIST_DIR, `./dist/tabler-${name}.d.ts`), typeDefinitionsTemplate() + '\n' + typings.join('\n'), 'utf-8')
  82. }
  83. export const getRollupPlugins = (pkg, minify) => {
  84. return [
  85. esbuild({
  86. minify
  87. }),
  88. license({
  89. banner: `${pkg.name} v${pkg.version} - ${pkg.license}`
  90. }),
  91. bundleSize(),
  92. visualizer({
  93. sourcemap: false,
  94. filename: `stats/${pkg.name}${minify ? '-min' : ''}.html`
  95. })
  96. ].filter(Boolean)
  97. }