You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
81 lines
2.3 KiB
81 lines
2.3 KiB
1 year ago
|
/* eslint-disable import/no-unresolved,no-console,global-require,import/no-dynamic-require */
|
||
|
|
||
|
const chalk = require('chalk');
|
||
|
const VueServerRenderer = require('vue/server-renderer');
|
||
|
|
||
|
const fs = require('fs-extra');
|
||
|
const glob = require('glob');
|
||
|
const path = require('path');
|
||
|
const ProgressBar = require('progress');
|
||
|
const { statistic } = require('../components/theme/util/statistic');
|
||
|
const { DesignTokenProvider } = require('../components/theme/internal');
|
||
|
const seedToken = require('../components/theme/themes/seed');
|
||
|
const { defineComponent, ref, createVNode, createSSRApp } = require('vue');
|
||
|
|
||
|
console.log(chalk.green(`🔥 Collecting token statistics...`));
|
||
|
|
||
|
const EmptyElement = createVNode('div');
|
||
|
|
||
|
const styleFiles = glob.sync(
|
||
|
path.join(
|
||
|
process.cwd(),
|
||
|
'components/!(version|config-provider|icon|locale-provider|auto-complete|col|row|time-picker|)/style/index.?(ts|tsx)',
|
||
|
),
|
||
|
);
|
||
|
|
||
|
const bar = new ProgressBar('🚀 Collecting by component: [:bar] :component (:current/:total)', {
|
||
|
complete: '=',
|
||
|
incomplete: ' ',
|
||
|
total: styleFiles.length,
|
||
|
});
|
||
|
|
||
|
styleFiles.forEach(file => {
|
||
|
const pathArr = file.split('/');
|
||
|
const styleIndex = pathArr.lastIndexOf('style');
|
||
|
const componentName = pathArr[styleIndex - 1];
|
||
|
bar.tick(1, { component: componentName });
|
||
|
let useStyle = () => {};
|
||
|
if (file.includes('grid')) {
|
||
|
const { useColStyle, useRowStyle } = require(file);
|
||
|
useStyle = () => {
|
||
|
useRowStyle();
|
||
|
useColStyle();
|
||
|
};
|
||
|
} else {
|
||
|
useStyle = require(file).default;
|
||
|
}
|
||
|
const Component = defineComponent({
|
||
|
setup() {
|
||
|
useStyle(ref('file'), ref());
|
||
|
return () => EmptyElement;
|
||
|
},
|
||
|
});
|
||
|
VueServerRenderer.renderToString(
|
||
|
createSSRApp({
|
||
|
setup() {
|
||
|
return () => createVNode(Component);
|
||
|
},
|
||
|
}),
|
||
|
);
|
||
|
// Render wireframe
|
||
|
VueServerRenderer.renderToString(
|
||
|
createSSRApp({
|
||
|
setup() {
|
||
|
return () =>
|
||
|
createVNode(
|
||
|
DesignTokenProvider,
|
||
|
{ value: { token: { ...seedToken, wireframe: true } } },
|
||
|
() => createVNode(Component),
|
||
|
);
|
||
|
},
|
||
|
}),
|
||
|
);
|
||
|
});
|
||
|
|
||
|
(() => {
|
||
|
const tokenPath = `${process.cwd()}/components/version/token.json`;
|
||
|
fs.writeJsonSync(tokenPath, statistic, 'utf8');
|
||
|
|
||
|
console.log(chalk.green(`✅ Collected token statistics successfully, check it in`), tokenPath);
|
||
|
})();
|