我使用survivaljs.com 站点作为模板，使用webpack 构建基于地图的React 应用程序。对于地图，我使用的是传单，但我找不到添加传单.css 的方法。如果没有这个，地图图块将以错误的顺序显示。
我已经尝试使用这个将 Leaflet.css 添加到 App.jsx 文件中
require('leaflet/dist/leaflet.css');
但得到以下错误
ERROR in ./~/leaflet/dist/leaflet.css
Module parse failed: myApp/node_modules/leaflet/dist/leaflet.css Unexpected token (3:0)
You may need an appropriate loader to handle this file type.
如果我可以访问 index.html，我可以将它添加到那里，但是我使用 webpack，我不清楚该怎么做？
我通过简单地导入 CSS 来解决它：
import 'leaflet/dist/leaflet.css';
在我使用 webpack（通过 create-react-app）的应用程序中，我将以下行添加到与地图相关的 css 文件的顶部：
/* map.css */
@import '~leaflet/dist/leaflet.css';
例如，此文件可能是map.css. 我还将任何自定义地图 css 样式放在此文件中。
然后在我使用Map组件的javascript / jsx 文件中，我导入这个 css 文件：
// map.js
import './map.css'
没有加载器的帮助，Webpack 无法解析 CSS。最常用的 CSS 加载器是webpack/css-loader。
我不同意 Lakshman Diwaakar 的回答，因为我认为在该组件的 JSX 中导入特定于组件的 CSS 文件非常有益，因为它允许该组件的所有相关代码位于一个地方。如果我删除该组件，则该 CSS 不再是任何构建的一部分。如果我想重用一个组件，那么 CSS 就在那里。
好的，所以我得到了来自 Survivaljs 的 Juho Vepsäläinen 的帮助。他的建议是
为了让它找到 Leaflet CSS，你应该确保在你的 webpack 配置中包含 Leaflet/dist/leaflet.css 的路径。如果您一直在关注材料，那么您可能在那里有一个样式路径设置 (PATHS.style)。沿着 path.resolve(__dirname, 'node_modules/leaflet/dist/leaflet.css') 有一些东西应该可以解决问题。
我听从了他的建议并将以下内容添加到 webpack.config 文件中：
style: [
path.join(__dirname, 'app', 'main.css'),
path.resolve(__dirname, 'node_modules/leaflet/dist/leaflet.css')
],
但我还需要稍后添加一个文件加载器
module: {
loaders: [
{test: /\.(png|jpg)$/, loader: "file-loader?name=images/[name].[ext]"}
]
}