React Native 中的图像轮播或图库

问：

我正在尝试使用 webpack 编译一个现有的 React Native 项目，使其在 Web 平台上可用。有一个名为 react-native-snap-carousel 的包在 Web 平台上运行不佳。

我使用 if 语句让它在网络上使用另一个包（react-image-gallery），这样做之后，它现在在 Web 上运行良好，但是当我尝试在 ios 或 android 上打开它时，提示错误，消息类似于“无法从”FlashGalleryWeb.js“中解析”react-image-gallery/styles/css/image-gallery.css”。由于 css 文件是 react-image-gallery 包的一部分，删除会让浏览器中的东西看起来很奇怪，我需要找到另一种方法来解决它。

我试图通过创建一个新文件在运行时注入 css 样式，然后有条件地调用它。 首先，将 css 文件复制并粘贴到 screens 文件夹中，以便于查找。 然后创建一个新文件 WebCSSLoader.js，其中的代码是

export function loadWebCSS() {
  const link = document.createElement('link');
  link.rel = 'stylesheet';
  link.href = '../path/to/image-gallery.css';
  document.head.appendChild(link);
}

然后在我的 FlashGalleryWeb.js 文件中，添加以下代码：

import { loadWebCSS } from './WebCSSLoader';

function MyComponent() {
  if (Platform.OS === 'web') {
    loadWebCSS();
  }

  // Rest of my code
}

现在，我可以在 ios 和 android 平台上打开它，但 CSS 样式不会应用于 Web。控制台中的错误消息为：拒绝应用来自“http://localhost:8080/screens/image-gallery.css”的样式，因为其 MIME 类型 （“text/html”） 不是受支持的样式表 MIME 类型，并且启用了严格的 MIME 检查。

此外，这里是 webpack.config.js 的一部分：

      {
        test: /\.css$/i,
        use: ["style-loader", "css-loader"],
      },

有什么方法可以解决这些问题吗？我对任何方法都持开放态度，包括使用其他包或对我的代码进行任何更改。

提前致谢！