Javascript 反应-如何使用本地范围的css和来自第三方组件的css

我正在使用

modules: true,
localIdentName: "[name]__[local]_[hash:base64:5]"

在webpack.config.dev和prod.js中。我可以使用我为组件定义的样式，使用“/Component.css”中的导入样式。 现在我尝试使用react select第三方组件。现在组件有了我想要使用的预定义样式。要使用它，我导入样式如下

导入“react select/dist/react select.css”

但是这种风格没有得到应用。如何为导入的组件启用预定义样式。

您可以根据查询使用不同的样式来处理CSS导入

通过这种方式，您可以使用

？外部

查询参数导入常规CSS

module.exports = {
  //...
  module: {
    rules: [
      {
        test: /.css$/,
        oneOf: [
          {
            // import 'react-select/dist/react-select.css?external'
            resourceQuery: /external/, 
            use: ['style-loader', 'css-loader']
          },
          {
            use: ['style-loader', 'css-loader'],
            options: {
              modules: true,
              localIdentName: '[name]__[local]_[hash:base64:5]'
            }
          }
        ]
      }
    ]
  }
};

---

我是新手，所以我的问题可能看起来很傻。在webpack.config.dev.js中，我将添加以下规则-“{//import”react-select/dist/react-select.css？external”resourceQuery:/external/，使用：['style-loader'，'css-loader']}，'现在在组件中如何使用？外部查询参数？或者我必须在我自己的构建组件中使用？外部？我想我明白你的意思了。在外部组件中，添加上述规则后，我必须使用import'react select/dist/react select.css？external'。如果我不正确，请告诉我，我将尝试一下。忽略我以前的评论。@Braj我回答中的评论，

import'react-select/dist/react-select.css？external'

，只是如何在应用程序中使用它的一个例子。如果导入的CSS文件在文件名末尾带有

？external

，Webpack会将其视为常规CSS，而不是CSS模块。只需在应用程序中编写一次

import'react-select/dist/react-select.css？external'

，那么

react-select

css将如预期的那样成为你的css的一部分。我将尝试并更新你。此外，涵盖网页包主题也会让我深入了解网页包如何与css和其他文件相关？工作起来很有魅力。谢谢