GitHub
/
ant-design
6
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

refactor: seo use react-helmet

pull/18727/head
ycjcl868 5 years ago
committed by 偏右
parent
caa6eb0973
commit
4490ee8483
4 changed files with 70 additions and 78 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      package.json
  2. 10
      site/theme/index.js
  3. 114
      site/theme/template/Content/ComponentDoc.jsx
  4. 23
      site/theme/template/Home/index.jsx

1
package.json
View File

@ -165,7 +165,6 @@
"react-copy-to-clipboard": "^5.0.1",
"react-dnd": "^9.0.0",
"react-dnd-html5-backend": "^9.0.0",
"react-document-title": "^2.0.3",
"react-dom": "^16.5.2",
"react-github-button": "^0.1.11",
"react-helmet": "^6.0.0-beta",

10
site/theme/index.js
View File

@ -51,16 +51,6 @@ module.exports = {
'bisheng-plugin-antd?injectProvider',
'bisheng-plugin-react?lang=__react',
],
postProcessHtml: ($, pathname) => {
let description = '';
if (pathname !== '/') {
const desc = $('section.markdown p').text() || '';
description = desc.length > 50 ? `${desc.slice(0, 50)}...` : desc;
}
return {
description: description || '',
};
},
routes: {
path: '/',
component: './template/Layout/index',

114
site/theme/template/Content/ComponentDoc.jsx
View File

@ -1,5 +1,5 @@
import React from 'react';
import DocumentTitle from 'react-document-title';
import { Helmet } from 'react-helmet';
import { FormattedMessage, injectIntl } from 'react-intl';
import classNames from 'classnames';
import { Row, Col, Icon, Affix, Tooltip } from 'antd';
@ -106,66 +106,68 @@ class ComponentDoc extends React.Component {
const articleClassName = classNames({
'show-riddle-button': showRiddleButton,
});
const helmetTitle = `${subtitle || ''} ${title[locale] || title} - Ant Design`;
return (
<DocumentTitle title={`${subtitle || ''} ${title[locale] || title} - Ant Design`}>
<article className={articleClassName}>
<Affix className="toc-affix" offsetTop={16}>
<ul id="demo-toc" className="toc">
{jumper}
</ul>
</Affix>
<section className="markdown">
<h1>
{title[locale] || title}
{!subtitle ? null : <span className="subtitle">{subtitle}</span>}
<EditButton
title={<FormattedMessage id="app.content.edit-page" />}
filename={filename}
/>
</h1>
{utils.toReactComponent(
['section', { className: 'markdown' }].concat(getChildren(content)),
)}
<h2>
<FormattedMessage id="app.component.examples" />
<Tooltip
title={
<FormattedMessage
id={`app.component.examples.${expandAll ? 'collapse' : 'expand'}`}
/>
}
>
<Icon
type={`${expandAll ? 'appstore' : 'appstore-o'}`}
className={expandTriggerClass}
onClick={this.handleExpandToggle}
<article className={articleClassName}>
<Helmet>
<title>{helmetTitle}</title>
</Helmet>
<Affix className="toc-affix" offsetTop={16}>
<ul id="demo-toc" className="toc">
{jumper}
</ul>
</Affix>
<section className="markdown">
<h1>
{title[locale] || title}
{!subtitle ? null : <span className="subtitle">{subtitle}</span>}
<EditButton
title={<FormattedMessage id="app.content.edit-page" />}
filename={filename}
/>
</h1>
{utils.toReactComponent(
['section', { className: 'markdown' }].concat(getChildren(content)),
)}
<h2>
<FormattedMessage id="app.component.examples" />
<Tooltip
title={
<FormattedMessage
id={`app.component.examples.${expandAll ? 'collapse' : 'expand'}`}
/>
</Tooltip>
</h2>
</section>
<Row gutter={16}>
<Col
span={isSingleCol ? 24 : 12}
className={isSingleCol ? 'code-boxes-col-1-1' : 'code-boxes-col-2-1'}
}
>
{leftChildren}
<Icon
type={`${expandAll ? 'appstore' : 'appstore-o'}`}
className={expandTriggerClass}
onClick={this.handleExpandToggle}
/>
</Tooltip>
</h2>
</section>
<Row gutter={16}>
<Col
span={isSingleCol ? 24 : 12}
className={isSingleCol ? 'code-boxes-col-1-1' : 'code-boxes-col-2-1'}
>
{leftChildren}
</Col>
{isSingleCol ? null : (
<Col className="code-boxes-col-2-1" span={12}>
{rightChildren}
</Col>
{isSingleCol ? null : (
<Col className="code-boxes-col-2-1" span={12}>
{rightChildren}
</Col>
)}
</Row>
{utils.toReactComponent(
[
'section',
{
className: 'markdown api-container',
},
].concat(getChildren(doc.api || ['placeholder'])),
)}
</article>
</DocumentTitle>
</Row>
{utils.toReactComponent(
[
'section',
{
className: 'markdown api-container',
},
].concat(getChildren(doc.api || ['placeholder'])),
)}
</article>
);
}
}

23
site/theme/template/Home/index.jsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import { injectIntl } from 'react-intl';
import DocumentTitle from 'react-document-title';
import { Helmet } from 'react-helmet';
import PropTypes from 'prop-types';
import Banner from './Banner';
import Page1 from './Page1';
@ -69,16 +69,17 @@ class Home extends React.Component {
const { isMobile } = this.context;
const childProps = { ...this.props, isMobile, locale: intl.locale };
return (
<DocumentTitle title={`Ant Design - ${intl.formatMessage({ id: 'app.home.slogan' })}`}>
<>
<style dangerouslySetInnerHTML={{ __html: getStyle() }} /> {/* eslint-disable-line */}
<Banner {...childProps} />
<Page1 {...childProps} />
<Page2 {...childProps} />
<Page3 {...childProps} />
<Footer />
</>
</DocumentTitle>
<>
<style dangerouslySetInnerHTML={{ __html: getStyle() }} /> {/* eslint-disable-line */}
<Helmet>
<title>{`Ant Design - ${intl.formatMessage({ id: 'app.home.slogan' })}`}</title>
</Helmet>
<Banner {...childProps} />
<Page1 {...childProps} />
<Page2 {...childProps} />
<Page3 {...childProps} />
<Footer />
</>
);
}
}

Write Preview
Loading…
Cancel
Save