mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-07 09:26:06 +08:00
docs: correct code iframe values (#38603)
* docs: correct code iframe values * chore: remove useless migrate script Co-authored-by: lijianan <574980606@qq.com>
This commit is contained in:
parent
43c14bb70e
commit
415cc833cf
@ -24,7 +24,7 @@ Alert component for feedback.
|
||||
<code src="./demo/description.tsx">Description</code>
|
||||
<code src="./demo/icon.tsx">Icon</code>
|
||||
<code src="./demo/close-text.tsx">Customized Close Text</code>
|
||||
<code src="./demo/banner.tsx" iframe>Banner</code>
|
||||
<code src="./demo/banner.tsx" iframe="250">Banner</code>
|
||||
<code src="./demo/loop-banner.tsx">Loop Banner</code>
|
||||
<code src="./demo/smooth-closed.tsx">Smoothly Unmount</code>
|
||||
<code src="./demo/error-boundary.tsx">ErrorBoundary</code>
|
||||
|
@ -25,7 +25,7 @@ group:
|
||||
<code src="./demo/description.tsx">含有辅助性文字介绍</code>
|
||||
<code src="./demo/icon.tsx">图标</code>
|
||||
<code src="./demo/close-text.tsx">自定义关闭</code>
|
||||
<code src="./demo/banner.tsx" iframe>顶部公告</code>
|
||||
<code src="./demo/banner.tsx" iframe="250">顶部公告</code>
|
||||
<code src="./demo/loop-banner.tsx">轮播的公告</code>
|
||||
<code src="./demo/smooth-closed.tsx">平滑地卸载</code>
|
||||
<code src="./demo/error-boundary.tsx">React 错误处理</code>
|
||||
|
@ -17,7 +17,7 @@ group: Other
|
||||
## Examples
|
||||
|
||||
<code src="./demo/basic.tsx">Basic</code>
|
||||
<code src="./demo/custom.tsx" iframe>Custom style</code>
|
||||
<code src="./demo/custom.tsx" iframe="400">Custom style</code>
|
||||
|
||||
## API
|
||||
|
||||
|
@ -18,7 +18,7 @@ group: 其他
|
||||
## 代码演示
|
||||
|
||||
<code src="./demo/basic.tsx">基本</code>
|
||||
<code src="./demo/custom.tsx" iframe>自定义样式</code>
|
||||
<code src="./demo/custom.tsx" iframe="400">自定义样式</code>
|
||||
|
||||
## API
|
||||
|
||||
|
@ -49,7 +49,7 @@ return (
|
||||
|
||||
<code src="./demo/basic.tsx">Basic Usage</code>
|
||||
<code src="./demo/withIcon.tsx">With an Icon</code>
|
||||
<code src="./demo/react-router.tsx" iframe>react-router V6</code>
|
||||
<code src="./demo/react-router.tsx" iframe="200">react-router V6</code>
|
||||
<code src="./demo/separator.tsx">Configuring the Separator</code>
|
||||
<code src="./demo/overlay.tsx">Bread crumbs with drop down menu</code>
|
||||
<code src="./demo/separator-component.tsx">Configuring the Separator</code>
|
||||
|
@ -50,7 +50,7 @@ return (
|
||||
|
||||
<code src="./demo/basic.tsx">基本</code>
|
||||
<code src="./demo/withIcon.tsx">带有图标的</code>
|
||||
<code src="./demo/react-router.tsx" iframe>react-router V6</code>
|
||||
<code src="./demo/react-router.tsx" iframe="200">react-router V6</code>
|
||||
<code src="./demo/separator.tsx">分隔符</code>
|
||||
<code src="./demo/overlay.tsx">带下拉菜单的面包屑</code>
|
||||
<code src="./demo/separator-component.tsx">分隔符</code>
|
||||
|
@ -16,14 +16,14 @@ FloatButton. Available since `5.0.0`.
|
||||
|
||||
## Examples
|
||||
|
||||
<code src="./demo/basic.tsx" iframe>Basic</code>
|
||||
<code src="./demo/type.tsx" iframe>Type</code>
|
||||
<code src="./demo/shape.tsx" iframe>Shape</code>
|
||||
<code src="./demo/description.tsx" iframe>Description</code>
|
||||
<code src="./demo/tooltip.tsx" iframe>FloatButton with tooltip</code>
|
||||
<code src="./demo/group.tsx" iframe="300">FloatButton Group</code>
|
||||
<code src="./demo/group-menu.tsx" iframe>Menu mode</code>
|
||||
<code src="./demo/back-top.tsx" iframe>BackTop</code>
|
||||
<code src="./demo/basic.tsx" iframe="360">Basic</code>
|
||||
<code src="./demo/type.tsx" iframe="360">Type</code>
|
||||
<code src="./demo/shape.tsx" iframe="360">Shape</code>
|
||||
<code src="./demo/description.tsx" iframe="360">Description</code>
|
||||
<code src="./demo/tooltip.tsx" iframe="360">FloatButton with tooltip</code>
|
||||
<code src="./demo/group.tsx" iframe="360">FloatButton Group</code>
|
||||
<code src="./demo/group-menu.tsx" iframe="360">Menu mode</code>
|
||||
<code src="./demo/back-top.tsx" iframe="360">BackTop</code>
|
||||
<code src="./demo/render-panel.tsx" debug>\_InternalPanelDoNotUseOrYouWillBeFired</code>
|
||||
|
||||
## API
|
||||
|
@ -17,14 +17,14 @@ demo:
|
||||
|
||||
## 代码演示
|
||||
|
||||
<code src="./demo/basic.tsx" iframe>基本</code>
|
||||
<code src="./demo/type.tsx" iframe>类型</code>
|
||||
<code src="./demo/shape.tsx" iframe>形状</code>
|
||||
<code src="./demo/description.tsx" iframe>描述</code>
|
||||
<code src="./demo/tooltip.tsx" iframe>含有气泡卡片的悬浮按钮</code>
|
||||
<code src="./demo/group.tsx" iframe="300">浮动按钮组</code>
|
||||
<code src="./demo/group-menu.tsx" iframe>菜单模式</code>
|
||||
<code src="./demo/back-top.tsx" iframe>回到顶部</code>
|
||||
<code src="./demo/basic.tsx" iframe="360">基本</code>
|
||||
<code src="./demo/type.tsx" iframe="360">类型</code>
|
||||
<code src="./demo/shape.tsx" iframe="360">形状</code>
|
||||
<code src="./demo/description.tsx" iframe="360">描述</code>
|
||||
<code src="./demo/tooltip.tsx" iframe="360">含有气泡卡片的悬浮按钮</code>
|
||||
<code src="./demo/group.tsx" iframe="360">浮动按钮组</code>
|
||||
<code src="./demo/group-menu.tsx" iframe="360">菜单模式</code>
|
||||
<code src="./demo/back-top.tsx" iframe="360">回到顶部</code>
|
||||
<code src="./demo/render-panel.tsx" debug>\_InternalPanelDoNotUseOrYouWillBeFired</code>
|
||||
|
||||
## API
|
||||
|
@ -61,11 +61,11 @@ Style of a navigation should conform to its level.
|
||||
<code src="./demo/top.tsx">Header-Content-Footer</code>
|
||||
<code src="./demo/top-side-2.tsx">Header Sider 2</code>
|
||||
<code src="./demo/top-side.tsx">Header-Sider</code>
|
||||
<code src="./demo/side.tsx" iframe>Sider</code>
|
||||
<code src="./demo/side.tsx" iframe="360">Sider</code>
|
||||
<code src="./demo/custom-trigger.tsx">Custom trigger</code>
|
||||
<code src="./demo/responsive.tsx">Responsive</code>
|
||||
<code src="./demo/fixed.tsx" iframe>Fixed Header</code>
|
||||
<code src="./demo/fixed-sider.tsx" iframe>Fixed Sider</code>
|
||||
<code src="./demo/fixed.tsx" iframe="360">Fixed Header</code>
|
||||
<code src="./demo/fixed-sider.tsx" iframe="360">Fixed Sider</code>
|
||||
<code src="./demo/custom-trigger-debug.tsx" debug>Custom trigger debug</code>
|
||||
|
||||
## API
|
||||
|
@ -62,11 +62,11 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hzEndUVEx/Layout.svg
|
||||
<code src="./demo/top.tsx">上中下布局</code>
|
||||
<code src="./demo/top-side-2.tsx">顶部-侧边布局-通栏</code>
|
||||
<code src="./demo/top-side.tsx">顶部-侧边布局</code>
|
||||
<code src="./demo/side.tsx" iframe>侧边布局</code>
|
||||
<code src="./demo/side.tsx" iframe="360">侧边布局</code>
|
||||
<code src="./demo/custom-trigger.tsx">自定义触发器</code>
|
||||
<code src="./demo/responsive.tsx">响应式布局</code>
|
||||
<code src="./demo/fixed.tsx" iframe>固定头部</code>
|
||||
<code src="./demo/fixed-sider.tsx" iframe>固定侧边栏</code>
|
||||
<code src="./demo/fixed.tsx" iframe="360">固定头部</code>
|
||||
<code src="./demo/fixed-sider.tsx" iframe="360">固定侧边栏</code>
|
||||
<code src="./demo/custom-trigger-debug.tsx" debug>自定义触发器 Debug</code>
|
||||
|
||||
## API
|
||||
|
@ -1,206 +0,0 @@
|
||||
/* eslint-disable no-console */
|
||||
const fs = require('fs-extra');
|
||||
// const glob = require('glob');
|
||||
const chalk = require('chalk');
|
||||
const path = require('path');
|
||||
const yaml = require('dumi/node_modules/js-yaml');
|
||||
|
||||
// 检查 ~demo 文件夹是否存在,存在则说明是来自 next 的合并
|
||||
// const tmpFolder = `~demo`;
|
||||
|
||||
// ==============================================================================
|
||||
// Log 先记录,flush 后才打印,以免打印过多无用信息
|
||||
let consoleLines = [];
|
||||
let consoleOffset = 0;
|
||||
|
||||
function logCache(...args) {
|
||||
consoleLines.push(args);
|
||||
}
|
||||
|
||||
function logClear() {
|
||||
consoleLines = [];
|
||||
}
|
||||
|
||||
function logFlush() {
|
||||
consoleLines.forEach(args => {
|
||||
const txt = args
|
||||
.map(arg => (arg && typeof arg === 'object' ? JSON.stringify(arg, null, 2) : arg))
|
||||
.join(' ');
|
||||
const lines = txt.split(/[\n\r]+/);
|
||||
lines.forEach(line => {
|
||||
console.log(' '.repeat(consoleOffset), line);
|
||||
});
|
||||
});
|
||||
|
||||
logClear();
|
||||
}
|
||||
|
||||
function log(...args) {
|
||||
logCache(...args);
|
||||
logFlush();
|
||||
}
|
||||
|
||||
function logOffset(offset) {
|
||||
consoleOffset = offset;
|
||||
}
|
||||
|
||||
// ==============================================================================
|
||||
// 执行迁移
|
||||
// if (fs.existsSync(tmpFolder)) {
|
||||
// let demoFileCount = 0;
|
||||
// let apiFileCount = 0;
|
||||
//
|
||||
// const files = glob
|
||||
// .sync(path.join(tmpFolder, `components/**`))
|
||||
// .filter(file => file.endsWith('.md'));
|
||||
// log('存在 ~demo 文件夹,先做迁移', files.length, '个文件');
|
||||
//
|
||||
// files.forEach(file => {
|
||||
// const filePath = file.split(path.sep).splice(1).join(path.sep);
|
||||
// if (fs.statSync(filePath).isDirectory()) {
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// if (!filePath.startsWith('components')) {
|
||||
// throw new Error('Tmp demo path not correct');
|
||||
// }
|
||||
//
|
||||
// fs.ensureDirSync(path.dirname(filePath));
|
||||
// if (filePath.startsWith('components/overview')) {
|
||||
// // overview 文件不需要迁移
|
||||
// return;
|
||||
// }
|
||||
//
|
||||
// if (filePath.endsWith('.en-US.md') || filePath.endsWith('.zh-CN.md')) {
|
||||
// // 保留 meta 信息
|
||||
// const md = fs.readFileSync(filePath, 'utf-8');
|
||||
// const [, frontmatter] = md.match(/^(---[^]+?\n---)/);
|
||||
// const legacyMD = fs.readFileSync(file, 'utf-8');
|
||||
// fs.writeFileSync(filePath, legacyMD.replace(/^(---[^]+?\n---)/, frontmatter));
|
||||
// } else {
|
||||
// fs.copyFileSync(file, filePath);
|
||||
// }
|
||||
//
|
||||
// if (filePath.includes('demo')) {
|
||||
// demoFileCount += 1;
|
||||
// } else {
|
||||
// apiFileCount += 1;
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// log('迁移完成,共迁移文件数:', apiFileCount, '个介绍文档', demoFileCount, '个 demo');
|
||||
// }
|
||||
|
||||
// ==============================================================================
|
||||
// 有一部分转换需要 hardcode,这里就不做分析简单替换了
|
||||
function hardcodeMD(content) {
|
||||
return content.replace(/```.*\n.*IconDisplay.*\n.*mountNode.*\n```/, '<IconSearch></IconSearch>');
|
||||
}
|
||||
|
||||
// 重新生成所有的 Demo 文件
|
||||
const componentsPath = path.join(__dirname, '../components');
|
||||
const components = fs
|
||||
.readdirSync(componentsPath)
|
||||
.filter(d => fs.existsSync(path.join(componentsPath, d, 'demo')));
|
||||
|
||||
components.forEach(component => {
|
||||
const demoPath = path.join(componentsPath, component, 'demo');
|
||||
const demos = fs.readdirSync(demoPath).filter(demo => demo.endsWith('.md'));
|
||||
const codes = demos
|
||||
.filter(demo => {
|
||||
const mdPath = path.join(demoPath, demo);
|
||||
const md = fs.readFileSync(mdPath, 'utf-8');
|
||||
return md.match(/^(---[^]+?\n---)\s+([^]+?)?\s+(```(?:tsx|jsx)[^]+?\n```)([^]*)$/);
|
||||
})
|
||||
.map(demo => {
|
||||
const mdPath = path.join(demoPath, demo);
|
||||
const md = fs.readFileSync(mdPath, 'utf-8');
|
||||
const [, frontmatter, content, code, extra] = md.match(
|
||||
/^(---[^]+?\n---)\s+([^]+?)?\s+(```(?:tsx|jsx)[^]+?\n```)([^]*)$/,
|
||||
);
|
||||
const meta = yaml.load(frontmatter.replace(/^---|---$/g, ''));
|
||||
const name = path.basename(demo, '.md');
|
||||
|
||||
return {
|
||||
name,
|
||||
meta,
|
||||
html: {
|
||||
'zh-CN': `<code src="./demo/${name}.tsx"${meta.debug ? ' debug' : ''}${
|
||||
meta.iframe ? ' iframe' : ''
|
||||
}>${meta.title['zh-CN']}</code>`,
|
||||
'en-US': `<code src="./demo/${name}.tsx"${meta.debug ? ' debug' : ''}${
|
||||
meta.iframe ? ' iframe' : ''
|
||||
}>${meta.title['en-US']}</code>`,
|
||||
},
|
||||
md: content + extra,
|
||||
code: code.replace(/^```(tsx|jsx)\n|```$/g, ''),
|
||||
};
|
||||
})
|
||||
.sort((a, b) => a.meta.order - b.meta.order);
|
||||
const zhPath = path.join(componentsPath, component, 'index.zh-CN.md');
|
||||
const enPath = path.join(componentsPath, component, 'index.en-US.md');
|
||||
const zh = fs.readFileSync(zhPath, 'utf-8');
|
||||
const en = fs.readFileSync(enPath, 'utf-8');
|
||||
|
||||
// if (!/cols: /.test(zh)) {
|
||||
// zh = zh.replace(/(\n---)/, '\ndemo:\n cols: 2$1');
|
||||
// }
|
||||
//
|
||||
// if (!/cols: /.test(en)) {
|
||||
// en = en.replace(/(\n---)/, '\ndemo:\n cols: 2$1');
|
||||
// }
|
||||
|
||||
logOffset(0);
|
||||
log();
|
||||
log(chalk.yellow('Update', component, ':'));
|
||||
logOffset(1);
|
||||
|
||||
// 中文
|
||||
const zhContent = zh
|
||||
.replace(/(\n## api)/i, `${codes.map(code => code.html['zh-CN']).join('\n')}$1`)
|
||||
.replace(/\ncols: 2(.*?)(\n---)/, '$1\ndemo:\n cols: 2$2')
|
||||
.replace(/\ncols: 1/, '');
|
||||
|
||||
fs.writeFileSync(zhPath, hardcodeMD(zhContent), 'utf-8');
|
||||
|
||||
// 英文
|
||||
const enContent = en
|
||||
.replace(/(\n## api)/i, `${codes.map(code => code.html['en-US']).join('\n')}$1`)
|
||||
.replace(/\ncols: 2(.*?)(\n---)/, '$1\ndemo:\n cols: 2$2')
|
||||
.replace(/\ncols: 1/, '');
|
||||
|
||||
fs.writeFileSync(enPath, hardcodeMD(enContent), 'utf-8');
|
||||
|
||||
log('写入', component, 'demo & demo md...');
|
||||
codes.forEach(code => {
|
||||
// const extraMeta = Object.keys(code.meta).filter(
|
||||
// key => !['title', 'order', 'debug'].includes(key),
|
||||
// );
|
||||
|
||||
// if (extraMeta.length) {
|
||||
// log('写入额外的 meta', code.meta);
|
||||
// code.code = `/*\n${extraMeta.map(key => ` * ${key}: ${code.meta[key]}`).join('\n')}\n */\n\n${
|
||||
// code.code
|
||||
// }`;
|
||||
// }
|
||||
|
||||
let importReactContent = "import React from 'react';";
|
||||
|
||||
const importReactReg = /import React(\D*)from 'react';\n/;
|
||||
const matchImportReact = code.code.match(importReactReg);
|
||||
if (matchImportReact) {
|
||||
[importReactContent] = matchImportReact;
|
||||
code.code = code.code.replace(importReactReg, '').trim();
|
||||
}
|
||||
fs.writeFileSync(
|
||||
path.join(demoPath, `${code.name}.tsx`),
|
||||
`${importReactContent}${code.code}\n`,
|
||||
'utf-8',
|
||||
);
|
||||
if (code.md.trim()) {
|
||||
fs.writeFileSync(path.join(demoPath, `${code.name}.md`), code.md, 'utf-8');
|
||||
} else {
|
||||
fs.unlinkSync(path.join(demoPath, `${code.name}.md`));
|
||||
}
|
||||
});
|
||||
});
|
Loading…
Reference in New Issue
Block a user