_.mixin is not a function

Using node and webstorm, when I start my app I get this error:

\node_modules\corejs-typeahead\dist\typeahead.bundle.js:195 _.mixin(LruCache.prototype, { ^

   TypeError: _.mixin is not a function

Has anyone else experianced this issue or know what causes it?

[jony89]

ok the problem (for me and probably for others as well) is that we run the code as well on the server side, for example rendering react on the server side and then serve html to the client.

since the code of jquery requires document :

function ( w ) {
    if ( !w.document ) {
        throw new Error( "jQuery requires a window with a document" );
    }
    return factory( w );
}

every function under $ is undefined, specifically $.extend and thus _.mixin is undefined

possible solutions :

1. fetch typehead with lazy loading on client side only (can be done with split point, dynamic loading script with webpack) for react you could require this library at componentDidMount

2. solution within the typehead library ?

[spapaseit]

Thank for your reply.

I’m loading the module dynamically as well, my import statement is on the attached() handler of an esNext module. I’m using Aurelia with Server Side Rendering, that’s why using a classic import {Bloodhound} from "corejs-typeahead"; thows the original error in this post.

Here’s the context in which I attempt the dynamic import.

async attached() {
        if (__aurelia__ssr__){
            return;
        }
        
        let module = await import("corejs-typeahead");
        let Bloodhound = module.Bloodhound;

     // ...
}

also I’m not sure why are you importing corejs-typeahead/dist/bloodhound rather than corejs-typeahead

Well, I was trying whether that would work, because importing corejs-typeahead gives exactly the same error: Cannot set property 'Bloodhound' of undefined, by which they mean root in the snippet of my previous comment.

But i guess you never ran into that one.