Cannot use node-fetch 3 in serverless functions

[whitep4nth3r]

Describe the bug

Using node-fetch 3 (latest) causes serverless functions to error and not run.

Steps to reproduce

1. Install latest node-fetch (version 3+)
2. Attempt to use fetch in a serverless function using import fetch from "node-fetch"
3. Observe below error:

{"errorMessage":"Cannot use import statement outside a module","errorType":"SyntaxError","level":"error","stackTrace":["ort fetch from \"node-fetch\";","^^^","","taxError: Cannot use import statement outside a module","Object.compileFunction (node:vm:352:18)","wrapSafe (node:internal/modules/cjs/loader:1027:15)","Module._compile (node:internal/modules/cjs/loader:1063:27)","Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)","Module.load (node:internal/modules/cjs/loader:975:32)","Function.Module._load (node:internal/modules/cjs/loader:822:12)","Module.require (node:internal/modules/cjs/loader:999:19)","require (node:internal/modules/cjs/helpers:102:18)","Object._executeSync (/opt/homebrew/lib/node_modules/netlify-cli/node_modules/lambda-local/build/lambdalocal.js:277:26)","/opt/homebrew/lib/node_modules/netlify-cli/node_modules/lambda-local/build/lambdalocal.js:95:26"]}

Note: Using node-fetch 2 and importing the dependency via const fetch = require("node-fetch"); works as expected.

Configuration

[[redirects]]
from = "/api/*"
to = "/.netlify/functions/:splat"

Environment

System:
OS: macOS 12.3.1
CPU: (10) arm64 Apple M1 Pro
Memory: 2.33 GB / 32.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 17.9.0 - /opt/homebrew/bin/node
Yarn: 1.22.18 - /opt/homebrew/bin/yarn
npm: 8.5.5 - /opt/homebrew/bin/npm
npmGlobalPackages:
netlify-cli: 10.0.0

[whitep4nth3r]

Closing because the fix is to name the serverless function with the .mjs extension.

[whitep4nth3r]

I've reopened the issue as I think we need some communication around this on the docs, OR, compile .js files that are using the import syntax correctly under the hood.

[jacklyn-net]

Spoke to @whitep4nth3r briefly about this during the DX Mobbing meeting, and I wanted to surface this for @klavavej to see if this is something that needs to be added to the Functions docs, since this is something that seems to be causing a lot of issues.

[klavavej]

Spoke to @whitep4nth3r briefly about this during the DX Mobbing meeting, and I wanted to surface this for @klavavej to see if this is something that needs to be added to the Functions docs, since this is something that seems to be causing a lot of issues.

this is somewhat related to https://github.com/netlify/docs/issues/1402
I'd like to see what engineering thinks about fixing this bug before trying to address this pain point with a docs update

[hrishikesh-k]

I believe if you use:

[functions]
  node_bundler = "esbuild"

it will fix the error and you can directly use .js files. To me, this doesn't appear to be a bug, as we need folks to use esbuild to import ESM modules.

[whitep4nth3r]

Agreed @hrishikesh-k — I guess I didn't find good docs about this at the time. We have a blog post out now — but just wanted to follow up with @klavavej as to whether this is now clearer on the docs?

[klavavej]

@hrishikesh-k @whitep4nth3r - support for ESM in the default zisi bundler was added in netlify/zip-it-and-ship-it#1018

Since folks are now seeing that node_bundler = "esbuild" is required for .js functions using ESM, I suspect there's been a regression with the feature enhancement to support ESM regardless of the bundler.

https://github.com/netlify/pod-compute/issues/147 has been filed to look into the possible regression

Related docs issue https://github.com/netlify/docs/issues/1760