docs: fix theme change (#46638)

* docs: fix theme change

* feat: make ssr cssVar always before cssinjs

* chore: code clean
This commit is contained in:
MadCcc 2023-12-27 17:32:02 +08:00 committed by GitHub
parent b49fb85c57
commit 55439cee71
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 28 additions and 15 deletions

View File

@ -134,10 +134,28 @@ const GlobalLayout: React.FC = () => {
const [styleCache] = React.useState(() => createCache());
useServerInsertedHTML(() => {
const styleText = extractStyle(styleCache, true);
const styleText = extractStyle(styleCache, {
plain: true,
types: 'style',
});
return <style data-type="antd-cssinjs" dangerouslySetInnerHTML={{ __html: styleText }} />;
});
useServerInsertedHTML(() => {
const styleText = extractStyle(styleCache, {
plain: true,
types: ['cssVar', 'token'],
});
return (
<style
data-type="antd-css-var"
data-rc-order="prepend"
data-rc-priority="-9999"
dangerouslySetInnerHTML={{ __html: styleText }}
/>
);
});
useServerInsertedHTML(() => (
<style
data-sandpack="true"

View File

@ -179,6 +179,15 @@ const RoutesPlugin = (api: IApi) => {
const cssFile = writeCSSFile('antd', antdStyle, antdStyle);
file.content = addLinkStyle(file.content, cssFile, true);
// Insert antd cssVar to head
const cssVarMatchRegex = /<style data-type="antd-css-var"[\S\s]+?<\/style>/;
const cssVarMatchList = file.content.match(cssVarMatchRegex) || [];
cssVarMatchList.forEach((text) => {
file.content = file.content.replace(text, '');
file.content = file.content.replace('<head>', `<head>${text}`);
});
return file;
}),
);
@ -190,20 +199,6 @@ const RoutesPlugin = (api: IApi) => {
return memo;
});
// zombieJ: Unique CSS file is large, we move to build css for each page.
// See the `modifyExportHTMLFiles` above.
// generate ssr css file
// api.onBuildHtmlComplete(() => {
// const styleCache = (global as any)?.styleCache;
// const styleText = styleCache ? extractStyle(styleCache) : '';
// const styleTextWithoutStyleTag = styleText
// .replace(/<style\s[^>]*>/g, '')
// .replace(/<\/style>/g, '');
// fs.writeFileSync(`./_site/${ssrCssFileName}`, styleTextWithoutStyleTag, 'utf8');
// });
};
export default RoutesPlugin;