Warning when using with webpack

[fantapop]

I'm importing https://github.com/sindresorhus/got/ into my project and using webpack to build. Webpack doesn't like requiring of expressions:

WARNING in ./node_modules/keyv/src/index.js
18:14-40 Critical dependency: the request of a dependency is an expression
 @ ./node_modules/keyv/src/index.js
 @ ./node_modules/cacheable-request/src/index.js
 @ ./node_modules/got/index.js
 @ ./lib/util.js
 @ ./functions/live-stream.js

I'm not sure what the best way to fix this up with would be

[lukechilds]

Does it work?

[fantapop]

It still seems to work. I haven't verified the code path it takes. I can look into that. It makes the warning during build. It looked like the pluggable back end may have been opt in so I was assuming there was a default.

…

On Thu, Jan 25, 2018 at 3:31 AM Luke Childs ***@***.***> wrote: Does it work? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#45 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGWbqPo2-fScIvtSdvElZxnsD7crqk4_ks5tOGX_gaJpZM4RsfYu> .

[lukechilds]

It should work absolutely fine as long as you're not including native Node.js storage adapters.

The Webpack warning is exactly that a warning, it's letting you know that one of your dependencies is requiring a dependency via an expression.

This is generally bad practice and will probably break static analysis but it's the only way to transparently require storage adapters.

It should be totally safe to ignore for now.

[roblav96]

@fantapop @lukechilds What's the recommended quick fix to remove the warnings from my console? I run a tight ship 📦:P

[lukechilds]

Close your eyes while the warning's on the screen.

[sindresorhus]

This has just another bad Webpack UX. I would recommend complaining on their issue tracker: webpack/webpack#196

[fantapop]

I've been using the close my eyes method...

…

On Tue, Mar 6, 2018 at 9:06 PM, Sindre Sorhus ***@***.***> wrote: This has just another bad Webpack UX. I would recommend complaining on their issue tracker: webpack/webpack#196 <webpack/webpack#196> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#45 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGWbqNEyi_Coy3ZrA8A0D1l17w2Kx80Kks5tb2rQgaJpZM4RsfYu> .

[Tobbe]

Don't know if this is good or bad, but I added this to my webpack config to get rid of the warning

plugins: [
  new webpack.ContextReplacementPlugin(/keyv/),
],

[transitive-bullshit]

It turns out this isn't a wholly innocuous warning.

If you're using Next.js on Vercel, as part of their build optimizations for serverless functions (like dynamic page rendering), they trace module imports to remove as much unused code as possible.

It took me awhile to realize that while I'm using keyv with next.js v12 (and webpack v5) locally, everything would build and work fine, but when deployed to Vercel, any page renders or api calls would throw errors because next.js failed to find the expression-based @keyv/redis import.

If anyone else ends up here tracking this issue down, here was my fix: transitive-bullshit/nextjs-notion-starter-kit@2226296

While I can understand keyv's design choice to have a simpler, implicit API, and while you could certainly argue that Next.js's behavior is aggressive, it's honestly a pretty common use case these days — and one that I think will only become more common in the future.

[transitive-bullshit]

https://github.com/microlinkhq/keyv by @Kikobeats appears to fix this issue, but upstream dependents like https://github.com/lukechilds/cacheable-request (which is used by got) would need to change. Or this package would need to update its API in the same way that @keyvhq/core has.

Either way, I think this is worth fixing as it is definitely affecting anyone using got with Next.js.

[Kikobeats]

@transitive-bullshit

Although @keyvhq/core fix the thing, there are still place where the dependency will be not used (like cacheable-request sub-dependencies tree).

For these situations, you can declare a NPM override at your package.json 🙂

"overrides": {
    "cacheable-request": {
      "keyv": "npm:@keyvhq/core@~1.6.6"
    }
  }

[nickluger]

I use this package transitively via got and see this issue only, since got upgraded indirectly to 4.5.0 of keyv. 🤷‍♂️

[AuthorOfTheSurf]

In my case I needed to update my badly-outdated @auth0/nextjs-auth0 dependency to the latest version. Some of my imports changed to look like @auth0/nextjs-auth0/client since they are client-side

My old auth0 dep was relying on cacheable-request and therefore keyv which I hadn't heard of till today. All of this can be seen in the error stack depending on your case

I encountered this bug when porting a NextJS 12 app to NextJS 13, so I suspect others may find their way here. In my case the error had a natural solution, and I was able to update an important security dependency

[Azleal]

the warning is still there, any solutions?