在Alpine.js中使用OpenLayers.js时遇导出错误的求助

我正尝试在Alpine.js中集成OpenLayers.js，但遇到无法解决的错误：
Uncaught SyntaxError: ambiguous indirect export: default
对应的导入语句：import olJf from "./dist/js/oljf.js";

源文件（oljf.js） #

//oljf.js
import Map from 'ol/Map.js';
import OSM from 'ol/source/OSM.js';
import TileLayer from 'ol/layer/Tile.js';
import View from 'ol/View.js';

export default function olJf () {
    new Map({
        target: 'map',
        layers: [
            new TileLayer({
                source: new OSM(),
            }),
        ],
        view: new View({
            center: [0, 0],
            zoom: 2,
        }),
    })
};

编译后在Alpine组件中的导入代码 #

//compiled file
import olJf from "./dist/js/oljf.js";

document.addEventListener('alpine:init', () => {

    Alpine.data('map', () => ({
            latitude: false,
            longitude: false,
            isLoading: false,
            init() {
                console.log(`map for ${this.latitude}`);
                console.log(window.oljf)
                const mapdiv = document.getElementById('openmap_offre')
                olJf()
            }
        })
    )
})

调用Alpine的HTML代码 #

<head>
    <script type="module" src="https://xxx.be/wp-content/themes/visittail/assets/js/map.js" defer></script>
</head>
<body>
 <div id="openmap_offre" class="mt-3" style="width: 100%; height: 400px;" x-data="map" x-init="initMap">
</div>
</body>

内容的提问来源于stack exchange，提问作者Jsenechal