Cannot find module 'react-native'

[chris-erickson]

Describe the bug
When building, I am getting Cannot find module 'react-native'.

11:01:33 AM: (@netlify/plugin-nextjs onBuild completed in 621ms)
11:01:33 AM: ​
11:01:33 AM: ────────────────────────────────────────────────────────────────
11:01:33 AM:   4. Functions bundling                                         
11:01:33 AM: ────────────────────────────────────────────────────────────────
11:01:33 AM: ​
11:01:34 AM: Packaging Functions from netlify/functions directory:
11:01:34 AM:  - next_image.js
11:01:34 AM:  - next_donate/next_donate.js
11:01:34 AM:  - next_index/next_index.js
11:01:34 AM:  - next_keyword_go/next_keyword_go.js
11:01:34 AM:  - next_news/next_news.js
11:01:34 AM:  - next_news_category_category/next_news_category_category.js
11:01:34 AM:  - next_news_year_month_day_slug/next_news_year_month_day_slug.js
11:01:34 AM:  - next_petitions/next_petitions.js
11:01:34 AM:  - next_petitions_sharecode/next_petitions_sharecode.js
11:01:34 AM: ​
11:01:53 AM: ​
11:01:53 AM: ────────────────────────────────────────────────────────────────
11:01:53 AM:   Dependencies installation error                               
11:01:53 AM: ────────────────────────────────────────────────────────────────
11:01:53 AM: ​
11:01:53 AM:   Error message
11:01:53 AM:   A Netlify Function failed to require one of its dependencies.
11:01:53 AM:   Please make sure it is present in the site's top-level "package.json".
​
11:01:53 AM:   In file "/opt/build/repo/packages/site/netlify/functions/next_index/next_index.js"
11:01:53 AM:   Cannot find module 'react-native'
11:01:53 AM:   Require stack:
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/node_modules/@netlify/zip-it-and-ship-it/src/node_dependencies/resolve.js
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/node_modules/@netlify/zip-it-and-ship-it/src/node_dependencies/index.js
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/node_modules/@netlify/zip-it-and-ship-it/src/main.js
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/src/plugins_core/functions/index.js
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/src/commands/get.js
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/src/core/main.js
11:01:53 AM:   - /opt/buildhome/.netlify-build-nvm/versions/node/v12.16.3/lib/node_modules/@netlify/build/src/core/bin.js

To Reproduce
https://app.netlify.com/sites/resistbot-website-ed6e4f/deploys/60bf9343df755e0008b22f0e
Some reference content that very closely matches my issue:

• Issues with sequelize netlify/next-on-netlify#33
• Cannot find module critters netlify/next-on-netlify#157
• next-on-netlify fails to build peer dependencies in deployment netlify/next-on-netlify#103

Our repo is private but would gladly give someone collaborator access as needed.

Expected behavior
Not sure what code I use that requires react-native (perhaps conditionally?) but this works locally. Might be correlated to switching to target: 'experimental-serverless-trace', but that's not clear.

Versions

• Next.js: 10.2.3

[[plugins]]
  package = "@netlify/plugin-nextjs"

[[plugins]]
  package = "netlify-plugin-submit-sitemap"

If you're using the CLI to build

• Building in the netlify UI

If you're using file-based installation

• netlify.toml:

[build]
  command = "yarn build"
  publish = ".next"
  environment = { NETLIFY_USE_YARN = "true", NEXT_IMAGE_ALLOWED_DOMAINS = "cdn.sanity.io", ACTIVE_ENV="staging" }

[context.production]
  environment = { ACTIVE_ENV = "production" }

[[plugins]]
  package = "@netlify/plugin-nextjs"

[[plugins]]
  package = "netlify-plugin-submit-sitemap"

  [plugins.inputs]
  baseUrl = "https://resist.bot"
  sitemapPath = "/sitemap.xml"
  providers = [
    "google",
    "bing",
  ]

[[plugins]]
  package = "@sentry/netlify-build-plugin"

  [plugins.inputs]
    sentryOrg = "<redacted>"
    sentryProject = "<redacted>"

[ascorbic]

Can you run yarn why react-native?

[chris-erickson]

It never shows up there. I did some spelunking in the lock file and did find a thing (react-qr-code) that referenced a react-native thing (@react-native-community/art), and when I remove that it appears to work. Which is a good start, and I think I can find a different tool that doesn't have tentacles in RN. It's just super weird because this is a new problem I haven't ever seen before and based on some of the linked issues, might be packaging related rather than strictly dependency related.

[lindsaylevine]

@chris-erickson hey chris! i ran this by some engineers who work on https://github.com/netlify/zip-it-and-ship-it.

suggestions:

1. can you try adding esbuild to your netlify.toml? per https://docs.netlify.com/configure-builds/file-based-configuration/#functions
2. if that doesn't work, would you mind giving us a minimal public repo that reproduces the issue? 🙏 we try to avoid private repos when possible for a few reasons. appreciate your understanding!!!

[chris-erickson]

Can I do this even if I'm not specifying any functions manually? I'm 100% using Next.js routes (no "api functions"). Happy to try this out a bit but I've extricated the third-party React component that had tentacles in RN for whatever reason.

[functions]
  node_bundler = "esbuild"

[lindsaylevine]

yes, you can! though the main point of trying it would be to see if it resolves the react-native module error that you reported, so i'd try it out on that version of your site. otherwise we can probably mark this as closed!

[chris-erickson]

I've updated to this, but now am bumping into this problem: #209

{
  "errorType": "Runtime.ImportModuleError",
  "errorMessage": "Error: Cannot find module '../../chunks/433.js'\nRequire stack:\n- /var/task/netlify/functions/next_petitions_sharecode/next_petitions_sharecode.js\n- /var/task/next_petitions_sharecode.js\n- /var/runtime/UserFunction.js\n- /var/runtime/index.js",
  "trace": [
    "Runtime.ImportModuleError: Error: Cannot find module '../../chunks/433.js'",
    "Require stack:",
    "- /var/task/netlify/functions/next_petitions_sharecode/next_petitions_sharecode.js",
    "- /var/task/next_petitions_sharecode.js",
    "- /var/runtime/UserFunction.js",
    "- /var/runtime/index.js",
    "    at _loadUserApp (/var/runtime/UserFunction.js:100:13)",
    "    at Object.module.exports.load (/var/runtime/UserFunction.js:140:17)",
    "    at Object.<anonymous> (/var/runtime/index.js:43:30)",
    "    at Module._compile (internal/modules/cjs/loader.js:999:30)",
    "    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)",
    "    at Module.load (internal/modules/cjs/loader.js:863:32)",
    "    at Function.Module._load (internal/modules/cjs/loader.js:708:14)",
    "    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:60:12)",
    "    at internal/main/run_main_module.js:17:47"
  ]
}

As one prior error message requested, I added the external modules (for some dynamic imports I use, I suspect):

[functions]
  node_bundler = "esbuild"
  external_node_modules = ["@ampproject/toolbox-optimizer", "next"]

[lindsaylevine]

@chris-erickson that is a duplicate of #337! feel free to close this one then and track on 337 :)

[chris-erickson]

Will consider closed for now, as there's too many moving parts here for me to pursue it, but once the bundler is working perhaps I can come back to it. Thanks!