Error deploying to now.sh

ericelliott commented 5 years ago

I just created a new npm module that uses esm, and then tried to deploy a project that uses the module. However, the deployment is failing with the following error output:

./node_modules/gql-validate/node_modules/esm/esm.js Critical dependency: require function is used in a way in which dependencies cannot be statically extracted ./node_modules/gql-validate/node_modules/esm/esm.js Module not found: Can't resolve 'internal/bootstrap/loaders' in '/tmp/634390ac/node_modules/gql-validate/node_modules/esm'

Jul 17 2019 11:43:47:701 | ...package.json | > Build error occurred Jul 17 2019 11:43:47:703 | ...package.json | { TypeError: Cannot destructure property dir of 'undefined' or 'null'. at Object. (/tmp/634390ac/.next/serverless/pages/register.js:9022:1704) at Object.eqrp (/tmp/634390ac/.next/serverless/pages/register.js:9023:30) at webpack_require (/tmp/634390ac/.next/serverless/pages/register.js:23:31) at Object. (/tmp/634390ac/.next/serverless/pages/register.js:9011:11) at Object.epOS (/tmp/634390ac/.next/serverless/pages/register.js:9015:30) at webpack_require (/tmp/634390ac/.next/serverless/pages/register.js:23:31) at Module.edYE (/tmp/634390ac/.next/serverless/pages/register.js:8825:20) at __webpack_require__ (/tmp/634390ac/.next/serverless/pages/register.js:23:31) at /tmp/634390ac/.next/serverless/pages/register.js:91:18 at Object. (/tmp/634390ac/.next/serverless/pages/register.js:94:10) type: 'TypeError', '$error': '$error' }

jdalton commented 5 years ago

The error require function is used in a way in which dependencies cannot be statically extracted looks to be related to a bundler. ~~Be sure to add a module or browser field to your package.json that points to the raw ES module (leaving the main to point to the CJS bridge).~~ It looks like you have the module field already. I wonder if something is ignoring the module field or somehow not configured to look for it.

ericelliott commented 5 years ago

Is there a good reason this is closed? 😕

I'm deploying all my apps to now.sh these days, and I'd like to be able to use esm in the dependencies. Because it rocks. 🎸

P.S. Thank you. 😄

jdalton commented 5 years ago

I'm not super familiar with now.sh but did point you in a direction to investigate. If you can find out why a bundle script is ignoring module then I think you'll resolve the issue but that's a bit beyond esm. Keep digging and report back.

ericelliott commented 5 years ago

Hi @jdalton - the Zeit team responded.

We've tracked down what's causing this and have opened two PRs with potential fixes:

zeit/next.js#8081

remain favoring main in package.json

transparently remove the usage of esm via source transforms (it's not needed in webpack)

zeit/next.js#8082

favor module in package.json

maintain a list of improperly published packages and their fixes

esm doesn't play friendly with webpack, thus the error you're experiencing.

Unfortunately, it's not as simple as preferring the module key over the main key, as this breaks an unknown number of npm packages.

A notable example is node-fetch (~10 million weekly downloads), along with other packages listed in this webpack issue: webpack/webpack#4742

ericelliott commented 5 years ago

This custom Webpack config solved my issue:

module.exports = {
  webpack(config, { isServer }) {
    if (isServer) {
      config.resolve.mainFields = ['module', 'main']

      // Fix all packages that this change breaks:
      config.resolve.alias['node-fetch'] = 'node-fetch/lib/index.js'
    }
    return config
  },
}

The Zeit team is working on merging a permanent fix.

jdalton commented 5 years ago

Wow! Thank you poking it @ericelliott!

jlarmstrongiv commented 3 years ago

Can this issue be reopened? This still errors for me with primitive. Had to use patch-package and replace all imports/exports with require/module.exports. Not a longterm solution.

standard-things / esm

Error deploying to now.sh #831