Closed brunetton closed 4 years ago
@brunetton you explained the steps to reproduce your problems, but could you push your code completely on a repo?
I suspect you installed svelte-pick-a-place
as a dependency
instead of a devDependency
and I'd like to try to fix it from your code base.
@brunetton Hi! Thank you for the thorough explanation. I'm sorry I haven't been able to look into this and helped you out yet, I started on a new job last week and have been pretty busy the last couple of days.
I will get back to you as soon as I can.
As @cbenz mentioned it would be great if you could publish a public repo where the issue is present though. Otherwise I'll try to recreate your issues myself but it might take a little longer.
At a first glance it seems like this issue could be more related to using non SSR friendly components with Sapper in general. But I'll test it with a Sapper project and see if I need to make any changes to the package or can show you a working example project.
That you're having to install and provide Leaflet yourself is fully intended though to allow for different usage scenarios where in some cases (mostly in legacy apps) you might already have a global leaflet instance available that you'd like to use.
@brunetton I think I'll need to make some changes to have it work properly with sapper if you install svelte-pick-a-place as a normal dependency. I've got a repo here (where it's loaded as a dev dependency) that should be working for you in the meantime though: https://github.com/jimutt/pap-sapper-example.
Checkout how the component is used in index.svelte. I'm loading leaflet dynamically and not rendering svelte-pick-a-place before leaflet is available.
I'll try to publish a hotfix later to allow using it as a normal dependency.
Thanks you very much @jimutt ! And sorry for my response delay, I was very busy on other subjects. Thanks for taking time to make this repo !
You example is working great, and I managed to see the differences with mine and make it work 👍
For future reference, a quick summary to get this working:
npm i --save-dev leaflet
){#if leaflet != null}
to avoid trying to initialize PickAPlace component before leaflet
variable is setThanks again for your time !
Hi, I just discovered this project and I'm very enthusiast about it !
I wanted to use it in a simple Sapper / Svelte 3 app but I ran onto some issues. Here it is, in details. I'm sorry if this is something that is supposed to be obvious; I'm absolutely not an experimented Node js developer !
Installation
Add dependency to pick-a-place-legacy npm package
npm i svelte-pick-a-place
Edit app files
I edited default
index.svelte
file to replace Borat by the Svelte example provided in doc.Run app
npm run dev
Leaflet problems
Error: Cannot find module 'leaflet'
npm i leaflet
ReferenceError: window is not defined
onMount
; this seems to work as there's no error about Leaflet loading anymoresvelte-pick-a-place problems
Error: Cannot find module 'svelte-pick-a-place'
node_modules/svelte-pick-a-place/
onMount
block and I seemed to "work", as it compiled<PickAPlace> is not a valid SSR component. You may need to review your build config to ensure that dependencies are compiled, rather than imported as pre-compiled modules
What did I missed here ? I had a look at
examples/basic-svelte
example; that works, but I think the difference is that svelte-pick-a-place is imported locally (in package.json:"svelte-pick-a-place": "../../"
and in index.html:<script defer src="/bundle.js"></script>
).Sorry again for this long report but I wanted to be the most precise possible to avoid wasting time with too many answers/responses.
Any help would be very appreciated :) Thanks ! (of course I'll contribute to the documentation if there's something to add for beginners like me)