Importing node_modules into Laravel via Mix

I'm trying to use OpenLayers (v5.3.0) in a Laravel 5.7 project, but am having a lot of trouble importing ol from node_modules.

I installed ol as follows (based on https://www.npmjs.com/package/ol):

npm install ol

I then updated my resources\js\app.js, which now contains only the following:

require('./bootstrap');
require('ol');

My webpack.mix.js contains the following:

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js/app.js', )
   .sass('resources/sass/app.scss', 'public/css');

I also have the following relevant lines in the php file I'm working on:

<script src="{!! mix('js/app.js') !!}"></script>
...
<div id='map' style='z-index: 1; width: 100%; height:calc(100% - 56px);'>
    <script>
        import Map from 'ol/Map';
        import View from 'ol/View';
        import TileLayer from 'ol/layer/Tile';
        import XYZ from 'ol/source/XYZ';

        new Map({
            target: 'map',
            layers: [
                new TileLayer({
                    source: new XYZ({
                        url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png'
                    })
                })
            ],
            view: new View({
                center: [0, 0],
                zoom: 2
            })
        });
    </script>
</div>

I have also run npm run dev.

When testing in Chrome, I get "Uncaught SyntaxError: Unexpected identifier" referring to the following line in map.blade.php:

import Map from 'ol/Map';

I've tried the solutions given to a lot of similar questions in Stack Overflow and elsewhere, and I've also tried using ol outside of npm, but I haven't found anything that resolves the issue for me. I believe using npm and Mix is the best way to build OpenLayers into my project, but I can't work out why it's not working. Would really appreciate some help.

from Newest questions tagged laravel-5 - Stack Overflow https://ift.tt/2QBbvjK
via IFTTT