如何包含“leaflet.css"在带有 webpack 的 React 应用程序中?

How to include quot;leaflet.cssquot; in a React app with webpack?(如何包含“leaflet.css在带有 webpack 的 React 应用程序中?)
本文介绍了如何包含“leaflet.css"在带有 webpack 的 React 应用程序中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我使用survivorjs.com 网站作为模板,使用webpack 构建基于地图的React 应用程序.对于我使用传单的地图,但我找不到添加leaflet.css 的方法.如果没有这个,地图图块的显示顺序就会错误.

I using the survivejs.com site as a template to build a map based React app with webpack. For the map i am using leaflet but i can't find a way to add the leaflet.css. Without this the map tiles are displayed in the wrong order.

我尝试使用这个将leaflet.css 添加到App.jsx 文件中

I have tried adding the leaflet.css to the App.jsx file using this

 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,我不清楚如何做到这一点?

If I had access to the index.html i could add it there but i with webpack, i'm unclear how to do this?

推荐答案

我通过像这样简单地导入 CSS 来解决它:

I solved it by simply importing the CSS like this:

import 'leaflet/dist/leaflet.css';

这篇关于如何包含“leaflet.css"在带有 webpack 的 React 应用程序中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益,请联系我们,我们会在确认后第一时间进行删除!

相关文档推荐

quot;Each child in an array should have a unique key propquot; only on first time render of page(“数组中的每个孩子都应该有一个唯一的 key prop仅在第一次呈现页面时)
Scale background image to fit ie8 window(缩放背景图像以适合 ie8 窗口)
@fontface in IE7 (IETEster) not working properly(IE7 (IETEster) 中的@fontface 无法正常工作)
Safari 5.1 breaks CSS table cell spacing(Safari 5.1 打破 CSS 表格单元格间距)
Azure App service not working with custom routing in React-Redux web app - need wildcard virtual directories?(Azure App 服务无法与 React-Redux Web 应用程序中的自定义路由一起使用 - 需要通配符虚拟目录吗?)
How to update object in React state(如何在 React 状态下更新对象)