javascript - Rails webpacker OpenLayers。未捕获ReferenceError:未定义ol。固定但未解决

完成错误：

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'的定义

最佳答案

在您的示例中，您正在调用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用于某些导入。

import * as ol from 'ol';

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