Why examples don't work? (a struggle with imports)


Why examples don't work? (a struggle with imports)



On the page https://openlayers.org/en/latest/examples/image-vector-layer.html I copied the HTML code from under the map to /tmp/a.html and run firefox /tmp/a.html.


/tmp/a.html


firefox /tmp/a.html



At first two problems appeared easy to fix:



To fix it:


<script>


<script type="module">


<meta charset="UTF-8">


<head></head>



But what to do with the third error?



TypeError: Error resolving module specifier: ol/Map.js


TypeError: Error resolving module specifier: ol/Map.js



I have Firefox 60.0.1.



So, are the HTML codes in the examples meant to be used as I did, or did I misunderstand something?



And what do I need in my code to import Map from ol/Map.js?


import Map from ol/Map.js



(I tried to reformulate the question, but if I still deserve a negative ranking, please explain why. Thanks)





ive got the same error trying to help you, this page may not be changed since the update, normally the examples work very well with copy paste
– nalm
Jun 29 at 11:45




1 Answer
1



It's because there are some changes due to latest release of OpenLayers (V5.0).
Now samples are based on ES6 modules whereas there was before another way of doing



You can compare the "simple" v4.6.5 sample with "simple" master sample



Using is not enough as it does not solve dependencies when doing import Map from ol/Map.js


import Map from ol/Map.js



There are at least 3 ways of doing:



The usual way to create Openlayers sample using version 5.0.0 is using à bundler like Webpack or Parcel. There is a tutorial for this.



I've also investigated JSPM with this sample



You can always use the old way of doing, like in version 4.6.5 using this other official tutorial without using import.


import



For solution 1, you can use codesandbox.io to avoid setting a local parcel/webpack environment like illustrated with this tweet.



I know there is a work on progress to refactor the code for samples and I also submitted some suggestions for codesandbox.io e.g https://github.com/openlayers/openlayers/issues/8324






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Comments

Post a Comment

Popular posts from this blog

paramiko-expect timeout is happening after executing the command

paramiko-expect timeout is happening after executing the command Can someone help me why timeout is happening after executing the command .I am trying to SSH to a machine and execute a command.I want to store the result of the executed command . I have referred paramiko-timeout but i didn't get my expected result. import traceback try: import paramiko except ImportError: raise Exception("Please install paramiko , pip install paramiko") import pexpect from paramiko_expect import SSHClientInteraction def main(): HOSTNAME = "minion5.net" USERNAME = "root" PASSWORD = "help@432" PROMPT = "root@*:~$s+" try: client = paramiko.SSHClient() client.load_system_host_keys() client.set_missing_host_key_policy(paramiko.AutoAddPolicy()) client.connect(hostname=HOSTNAME, username=USERNAME, password=PASSWORD) with SSHClientInteraction(client, timeout=20, display=True) as interact: ...
Read more

Opening a url is failing in Swift

Opening a url is failing in Swift breakpointing inside the callback and logging success shows false. I added itms-apps to my plist: LSApplicationQueriesSchemes and put this in my app delegate: func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool { return true } func moreTapped() { let url = NSURL(string: "itms-apps://itunes.com/developer/quantum-productions/id979315877") if #available(iOS 10.0, *) { UIApplication.shared.open(url! as URL, options: [:], completionHandler: {(success: Bool) in }) } else { UIApplication.shared.openURL(url! as URL) } } Are you testing on a real device? – rmaddy Jun 21 at 23:57 I try on a device, get "Cannot Connect to App Store". Device is online ...
Read more

Export result set on Dbeaver to CSV

Export result set on Dbeaver to CSV Normally I use Dbeaver for windows and always export my result set like this: run my query --> select the result --> export the result set --> select export to clipboard --> done This step by step puts my result set in my clipboard and I can paste it wherever I want to work with it. The problem is that now I am using dbeaver for mac and this guide is not working. I can go on until the moment that I select my result set like in the image below: exporting data set But once I go further in the process, in the last step I get: no query Note that in "source" it was suppose to show the query that originated the result set, but instead it says just "select. As a result it does't select my result or anything (besides being "successful"). Normally my query would show up there automatically and I couldn't find any option that corrects this problem in the menus. Please help me! Thanks. Aft...
Read more