svelte-carousel icon indicating copy to clipboard operation
svelte-carousel copied to clipboard

TypeError: after_update is undefined

Open mylastore opened this issue 5 years ago • 11 comments

Awesome library!!!!

I am getting this error after installing and copying the example setup.

TypeError: after_update is undefined

mylastore avatar Apr 14 '20 04:04 mylastore

How are you installing the library?

antony avatar Apr 14 '20 07:04 antony

How are you installing the library?

I am using Parcel as a bundler instead of Rollup. I believe that has to be the reason why I get that error. I installed the npm module and just copy the example code from the readme file.

mylastore avatar Apr 14 '20 14:04 mylastore

I'm not sure how well Parcel supports Svelte yet, as in the early days of Svelte 3 it didn't, and I converted my projects over to Rollup because of that.

antony avatar Apr 28 '20 07:04 antony

I have exactly the same problem, but with officialy supported webpack. Nothing fancy in build.

soanvig avatar Jul 14 '20 11:07 soanvig

It's that code precisely (internal svelte code):

function mount_component(component, target, anchor) {
    const { fragment, on_mount, on_destroy, after_update } = component.$$;
    fragment && fragment.m(target, anchor);
    // onMount happens before the initial afterUpdate
    add_render_callback(() => {
        const new_on_destroy = on_mount.map(run).filter(is_function);
        if (on_destroy) {
            on_destroy.push(...new_on_destroy);
        }
        else {
            // Edge case - component was destroyed immediately,
            // most likely as a result of a binding initialising
            run_all(new_on_destroy);
        }
        component.$$.on_mount = [];
    });
    after_update.forEach(add_render_callback);
}

The rest of my application works fine. Carousel is the only external svelte component I have.

soanvig avatar Jul 14 '20 11:07 soanvig

Running into this error using Vite 1.0.0-beta.11, Svite 0.2.3, and Rollup 2.21.0.

This is how I'm using the library:

<script>
	import Carousel from '@beyonk/svelte-carousel';
</script>

<Carousel perPage={{ 800: 3, 500: 2 }} autoplay={4000} duration={400} dots={false}>
    <span class="control" slot="left-control">
        &#8592;
    </span>
    <span class="control" slot="right-control">
        &#8594;
    </span>
	
    <div class="slide-content">
        <img src="https://picsum.photos/id/10/400/500" alt="Kitten 1"/>
    </div>
    <div class="slide-content">
        <img src="https://picsum.photos/id/100/400/500" alt="Kitten 1"/>
    </div>
    <div class="slide-content">
        <img src="https://picsum.photos/id/230/400/500" alt="Kitten 1"/>
    </div>
    <div class="slide-content">
        <img src="https://picsum.photos/id/1015/400/500" alt="Kitten 1"/>
    </div>
    <div class="slide-content">
        <img src="https://picsum.photos/id/1016/400/500" alt="Kitten 1"/>
    </div>
    <div class="slide-content">
        <img src="https://picsum.photos/id/1018/400/500" alt="Kitten 1"/>
    </div>
</Carousel>

parker-codes avatar Jul 21 '20 01:07 parker-codes

same, any updates?

elialbert avatar Aug 05 '20 19:08 elialbert

it's definitely something to do with the build, it is sufficient to copy the svelte component into my app directly for this to start working.

elialbert avatar Aug 05 '20 19:08 elialbert

Are you installing it with --save-dev? It's essential that dependencies in Svelte are installed as devDependencies.

On Wed, 5 Aug 2020 at 20:42, Eli Albert [email protected] wrote:

it's definitely something to do with the build, it is sufficient to copy the svelte component into my app directly for this to start working.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/beyonk-adventures/svelte-carousel/issues/22#issuecomment-669449917, or unsubscribe https://github.com/notifications/unsubscribe-auth/AABVORITAMPNURS2BRDKBXDR7GY37ANCNFSM4MHNWGEQ .

--


ꜽ . antony jones . http://www.enzy.org

antony avatar Aug 05 '20 19:08 antony

thank you for reaching out - I was not, but I just tried it, and the effect is the same

elialbert avatar Aug 05 '20 19:08 elialbert

I have the same problem with my storybook which is using Webpack as a bundler. The current solution is to change the import from:

import Carousel from '@beyonk/svelte-carousel';

to

import Carousel from '@beyonk/svelte-carousel/src/Carousel.svelte';

This does not effect the rollup build. I guess you can also solve this with a better Webpack configuration, but it worked out for me.

kulturbande avatar Oct 14 '20 12:10 kulturbande