如何将Gatsby网站的方向改为RTL？

npm install react-app-rewired rtlcss-loader --save-dev

module.exports = {
  webpack: (config, { stage, loaders }) => {
    if (stage === "develop-html" || stage === "build-html") {
      config.loader("null", {
        test: /react-rtl-component/,
        loader: "null-loader",
      });
    }

    if (stage === "develop" || stage === "build-javascript") {
      config.module.rules.push({
        test: /\.css$/,
        use: [
          {
            loader: loaders.css.loader,
            options: {
              modules: {
                mode: "local",
                localIdentName: "[name]-[local]-[hash:base64:5]",
              },
              importLoaders: 1,
              localsConvention: "camelCase",
            },
          },
          {
            loader: "rtlcss-loader",
          },
        ],
      });
    }

    return config;
  },
};

body {
  direction: rtl;
}

/* 如果需要适应不同语言的RTL布局，可以为特定语言添加样式规则 */
/* 例如：
body[lang="ar"] {
  /* 针对阿拉伯语的样式规则 */
/* }
*/

gatsby develop