build-icons.mjs 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  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 ext
  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. }) => {
  31. const DIST_DIR = path.resolve(PACKAGES_DIR, name),
  32. svgFiles = readSvgs()
  33. let index = []
  34. let typings = []
  35. svgFiles.forEach((svgFile, i) => {
  36. const children = svgFile.obj.children
  37. .map(({
  38. name,
  39. attributes
  40. }, i) => {
  41. if (key) {
  42. attributes.key = `svg-${i}`
  43. }
  44. return [name, attributes]
  45. })
  46. .filter((i) => {
  47. const [name, attributes] = i
  48. return !attributes.d || attributes.d !== 'M0 0h24v24H0z'
  49. })
  50. // process.stdout.write(`Building ${i}/${svgFiles.length}: ${svgFile.name.padEnd(42)}\r`)
  51. let component = componentTemplate({
  52. name: svgFile.name,
  53. namePascal: svgFile.namePascal,
  54. children,
  55. stringify,
  56. svg: svgFile
  57. })
  58. const output = pretty ? prettier.format(component, {
  59. singleQuote: true,
  60. trailingComma: 'all',
  61. parser: 'babel'
  62. }) : component
  63. let filePath = path.resolve(DIST_DIR, 'src/icons', `${svgFile.name}.${extension}`)
  64. fs.writeFileSync(filePath, output, 'utf-8')
  65. index.push(indexItemTemplate({
  66. name: svgFile.name,
  67. namePascal: svgFile.namePascal
  68. }))
  69. typings.push(indexTypeTemplate({
  70. name: svgFile.name,
  71. namePascal: svgFile.namePascal
  72. }))
  73. })
  74. fs.writeFileSync(path.resolve(DIST_DIR, `./src/icons.js`), index.join('\n'), 'utf-8')
  75. fs.ensureDirSync(path.resolve(DIST_DIR, `./dist/`))
  76. fs.writeFileSync(path.resolve(DIST_DIR, `./dist/tabler-${name}.d.ts`), typeDefinitionsTemplate() + '\n' + typings.join('\n'), 'utf-8')
  77. }
  78. export const getRollupPlugins = (pkg, minify) => {
  79. return [
  80. esbuild({
  81. minify,
  82. }),
  83. license({
  84. banner: `${pkg.name} v${pkg.version} - ${pkg.license}`
  85. }),
  86. bundleSize(),
  87. visualizer({
  88. sourcemap: false,
  89. filename: `stats/${pkg.name}${minify ? '-min' : ''}.html`
  90. })
  91. ].filter(Boolean)
  92. }