collect-token-statistic.js 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. /* eslint-disable import/no-unresolved,no-console,global-require,import/no-dynamic-require */
  2. const chalk = require('chalk');
  3. const VueServerRenderer = require('vue/server-renderer');
  4. const fs = require('fs-extra');
  5. const glob = require('glob');
  6. const path = require('path');
  7. const ProgressBar = require('progress');
  8. const { statistic } = require('../components/theme/util/statistic');
  9. const { DesignTokenProvider } = require('../components/theme/internal');
  10. const seedToken = require('../components/theme/themes/seed');
  11. const { defineComponent, ref, createVNode, createSSRApp } = require('vue');
  12. console.log(chalk.green(`🔥 Collecting token statistics...`));
  13. const EmptyElement = createVNode('div');
  14. const styleFiles = glob.sync(
  15. path.join(
  16. process.cwd(),
  17. 'components/!(version|config-provider|icon|locale-provider|auto-complete|col|row|time-picker|)/style/index.?(ts|tsx)',
  18. ),
  19. );
  20. const bar = new ProgressBar('🚀 Collecting by component: [:bar] :component (:current/:total)', {
  21. complete: '=',
  22. incomplete: ' ',
  23. total: styleFiles.length,
  24. });
  25. styleFiles.forEach(file => {
  26. const pathArr = file.split('/');
  27. const styleIndex = pathArr.lastIndexOf('style');
  28. const componentName = pathArr[styleIndex - 1];
  29. bar.tick(1, { component: componentName });
  30. let useStyle = () => {};
  31. if (file.includes('grid')) {
  32. const { useColStyle, useRowStyle } = require(file);
  33. useStyle = () => {
  34. useRowStyle();
  35. useColStyle();
  36. };
  37. } else {
  38. useStyle = require(file).default;
  39. }
  40. const Component = defineComponent({
  41. setup() {
  42. useStyle(ref('file'), ref());
  43. return () => EmptyElement;
  44. },
  45. });
  46. VueServerRenderer.renderToString(
  47. createSSRApp({
  48. setup() {
  49. return () => createVNode(Component);
  50. },
  51. }),
  52. );
  53. // Render wireframe
  54. VueServerRenderer.renderToString(
  55. createSSRApp({
  56. setup() {
  57. return () =>
  58. createVNode(
  59. DesignTokenProvider,
  60. { value: { token: { ...seedToken, wireframe: true } } },
  61. () => createVNode(Component),
  62. );
  63. },
  64. }),
  65. );
  66. });
  67. (() => {
  68. const tokenPath = `${process.cwd()}/components/version/token.json`;
  69. fs.writeJsonSync(tokenPath, statistic, 'utf8');
  70. console.log(chalk.green(`✅ Collected token statistics successfully, check it in`), tokenPath);
  71. })();