Rails webpacker OpenLayers。未捕获ReferenceError：未定义ol。已修复但尚未解决

Question

完全错误：

layerSwitcherDemo.js:52 Uncaught ReferenceError: ol is not defined
    at Module../app/javascript/packs/layerSwitcherDemo.js (layerSwitcherDemo.js:52)
    at __webpack_require__ (bootstrap:19)
    at bootstrap:83
    at bootstrap:83
./app/javascript/packs/layerSwitcherDemo.js @   layerSwitcherDemo.js:52
__webpack_require__ @   bootstrap:19
(anonymous) @   bootstrap:83
(anonymous)

这是从people/show.html.erb到<%= javascript_pack_tag 'layerSwitcherDemo' %>调用的。

如果我使用<%= javascript_pack_tag 'layerSwitcherDemo' %>中的相同map/ol_layer_switcher.html.erb，则脚本可以正常工作。

// javascript/packs/layerSwitcherDemo.js
import Map from 'ol/Map';
import View from 'ol/View';
import { transform } from 'ol/proj';
import LayerGroup from 'ol/layer/Group';
import LayerImage from 'ol/layer/Image';
import LayerTile from 'ol/layer/Tile';
import SourceOSM from 'ol/source/OSM';
import XYZ from 'ol/source/XYZ';
import LayerSwitcher from 'ol-layerswitcher';
import {transformExtent, fromLonLat} from 'ol/proj';

var <a long list>

// the next line is line 52 in the error      
var map = new ol.Map({
    target: 'map',
    layers: [
// rest of the code

我正在尝试慢慢建立OpenLayers地图。我将使用与LayerSwitcherDemo不同的东西，我只是为了确保它可以在Rails中加载。层切换器是我修改的演示。

只需考虑比较已编译的layerSwitcherDemo-xx.js脚本，并且所有55k行都是相同的。 application-xx.js相同。

已修复，但尚未解决。正在工作的页面已加载OpenLayers的CDN版本。作为Webpack的新手，我不确定哪个最好。我想我携带的代码更少。让CDN做到这一点。这将是一个很少使用的应用程序。我猜我需要某种等同于import $ from 'jquery'

的定义

Answer 1

在您的示例中，您正在呼叫ol.Map，但是您已经导入了Map。如下编辑Webpack JS：

import Map from 'ol/Map'

// ... other imports

const map = new Map({   // replaces ol.Map
    target: 'map',
    layers: [
// ...

或者，以下内容将根据main entry point in the the openlayer module用于 some 导入。

import * as ol from 'ol';

new ol.Map() // but not ol.LayerGroup, for example ... 

Answer 2

包含在发布中。我通过使用OpenLayers CDN进行了修复，而不是依赖webpack来加载ol。以下是无效页面的参考资料。 ol（openlayers）在那里。