如何从全局作用域中删除CSS并仅导入到React中的特定页面，Gatsby

exports.onInitialClientRender = () => {
  // 删除全局作用域中的CSS
  const styles = document.querySelectorAll('link[rel="stylesheet"]');
  styles.forEach((style) => {
    style.parentNode.removeChild(style);
  });

  // 导入特定页面的CSS
  const pageStyles = document.querySelectorAll('link[data-page-specific-css]');
  pageStyles.forEach((style) => {
    document.head.appendChild(style);
  });
};

import React from 'react';
import { Helmet } from 'react-helmet';

const MyPage = () => (
  <>
    <Helmet>
      <link
        rel="stylesheet"
        href="/path/to/my-page.css"
        data-page-specific-css
      />
    </Helmet>
    {/* 页面内容 */}
  </>
);

export default MyPage;