我已经有几天试图让Openlayers与我的Django网站一起工作了。 我完全是Web的菜鸟，所以我可能会错过一些我还无法理解的简单内容。
据我了解，我需要加载Openlayers，所以在我的index.html中，我在<head>中添加了以下内容：
<script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.3.1/build/ol.js"></script>
然后在<body>中，我添加了我想使用 openlayer 的index.js：
<script src="{% static 'index.js'%}"></script>
我已经在index.js复制粘贴了一个简单的示例，并且它一直正常工作。
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: ol.proj.fromLonLat([2.333333, 48.866667]),
zoom: 10
})
});
所以我有一张以巴黎为中心的地图。现在我想加载一个GeoJson文件，因此我需要添加一个包含 GeoJon 的图层。为此，我在这里遵循了一个示例。
这是我尝试像这样导入的第一个问题：import GeoJSON from 'ol/format/GeoJSON';或者像这样import Style from ol.style.Style我得到了这个错误：Uncaught SyntaxError: Cannot use import statement outside a module我找到的唯一解决方案是new ol.style.Style(...)何时需要使用它。丑陋，但有效。
因此，我删除了所有导入并使用每个类的完整路径来调用构造函数。直到其中一个不起作用。
var vectorLayer = new ol.layer.Vector.VectorLayer({
source: new ol.source.Vector.VectorSource({
url: 'data/geojson/countries.geojson',
format: new ol.format.GeoJSON()
}),
style: function(feature) {
style.getText().setText(feature.get('name'));
return style;
}
});
未捕获的类型错误：ol.source.Vector.VectorSource 不是构造函数
https://openlayers.org/en/latest/apidoc/module-ol_source_Vector-VectorSource.html
所以我问我自己为什么它不起作用，以及如何让它不那么丑陋(使用导入(
var vectorLayer = new ol.layer.Vector({
source: new ol.source.Vector({
您可以查看 OpenLayers 4 示例 https://openlayers.org/en/v4.6.5/examples/以获取完整的构建语法