CLI unable to resolve Node Modules in Functions

[hrishikesh-k]

Describe the bug

I'm unable to run Netlify Functions using CLI. I keep getting messages of "Could not resolve" even though the modules are installed on my system. I tried creating a minimal reproduction of my setup and was able to reproduce it. Not sure what I'm missing.

Steps to reproduce

Repo: https://github.com/Hrishikesh-K/cli-test

After cloning and running npm i, try running npx netlify dev. You can see messages in the console like:

◈ Netlify Dev ◈
◈ Injected netlify.toml file env var: NODE_VERSION
◈ Loaded function api http://localhost:8888/.netlify/functions/api.
◈ Functions server is listening on 58524
◈ Starting Netlify Dev with Vite
⠋ Waiting for framework port 5173. This can be configured using the 'targetPort' property in the netlify.toml✘ [ERROR] Cannot read directory "..": operation not permitted

✘ [ERROR] Could not resolve "axios"

    netlify/functions/api.ts:5:25:
      5 │ import {AxiosError} from 'axios'
        ╵                          ~~~~~~~

  You can mark the path "axios" as external to exclude it from the bundle, which will remove this
  error.

✘ [ERROR] Could not resolve "cookie-parser"

    netlify/functions/api.ts:6:25:
      6 │ import cookieParser from 'cookie-parser'
        ╵                          ~~~~~~~~~~~~~~~

  You can mark the path "cookie-parser" as external to exclude it from the bundle, which will remove
  this error.

✘ [ERROR] Could not resolve "serverless-http"

    netlify/functions/api.ts:8:23:
      8 │ import serverless from 'serverless-http'
        ╵                        ~~~~~~~~~~~~~~~~~

  You can mark the path "serverless-http" as external to exclude it from the bundle, which will
  remove this error.

⠙ Waiting for framework port 5173. This can be configured using the 'targetPort' property in the netlify.toml=============

WARNING: You are currently running a version of TypeScript which is not officially supported by @typescript-eslint/typescript-estree.

You may find that it works just fine, or you may not.

SUPPORTED TYPESCRIPT VERSIONS: >=3.3.1 <4.7.0

YOUR TYPESCRIPT VERSION: 4.7.4

Please only submit bug reports when using the officially supported version.

=============

> cli-test@0.1.0 dev
> vite


  VITE v3.0.4  ready in 492 ms

  ➜  Local:   http://127.0.0.1:5173/
  ➜  Network: use --host to expose
⠴ Waiting for framework port 5173. This can be configured using the 'targetPort' property in the netlify.toml

However, when running:

esbuild --bundle ./netlify/functions/api.ts --outfile=./dist/output.js --platform=node

it works. So esbuild is able to bundle the file correctly.

Configuration

[build]
  base = "/"
  command = "npm run build"
  publish = "dist"
  [build.environment]
    NODE_VERSION = "16"
[dev]
  targetPort = 5173
[functions]
  external_node_modules = ["express"]
  node_bundler = "esbuild"
[[redirects]]
  force = true
  from = "/api/*"
  status = 200
  to = "/.netlify/functions/api/:splat"
[[redirects]]
  from = "/*"
  status = 200
  to = "/index.html"

Environment

System:
  OS: macOS 12.5
  CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Memory: 505.38 MB / 16.00 GB
  Shell: 5.8.1 - /bin/zsh
Binaries:
  Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
  npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
  npmPackages:
    netlify-cli: ^10.15.0 => 10.15.0

[danez]

Unfortunately I am not able to reproduce this.

I did a fresh checkout (on gitpod):

• npm install
• npm build (which failed)
• npm exec netlify dev

Maybe npm has hick-ups? Try removing node_modules and run npm i again?

[hrishikesh-k]

Thanks for checking! Unfortunately, this is still happening for me 🙁

The build error can be removed by moving index.html out of the public folder - I must have moved that there by mistake. I've also committed the change on the repo, so that should be good to clone.

I did a fresh clone myself, ran npm i and still the same. I tried running netlify build -offline, and that failed too:

vite v3.0.4 building for production...
✓ 10 modules transformed.
dist/index.html         0.50 KiB
dist/entries/index.js   50.87 KiB / gzip: 20.52 KiB
dist/entries/index.js.map 564.39 KiB
​
(build.command completed in 5s)
​
────────────────────────────────────────────────────────────────
  2. Functions bundling                                         
────────────────────────────────────────────────────────────────
​
Packaging Functions from netlify/functions directory:
 - api.ts
​
✘ [ERROR] Cannot read directory "..": operation not permitted

✘ [ERROR] Could not resolve "axios"

    netlify/functions/api.ts:5:25:
      5 │ import {AxiosError} from 'axios'
        ╵                          ~~~~~~~

  You can mark the path "axios" as external to exclude it from the bundle, which will remove this
  error.

✘ [ERROR] Could not resolve "cookie-parser"

    netlify/functions/api.ts:6:25:
      6 │ import cookieParser from 'cookie-parser'
        ╵                          ~~~~~~~~~~~~~~~

  You can mark the path "cookie-parser" as external to exclude it from the bundle, which will remove
  this error.

✘ [ERROR] Could not resolve "serverless-http"

    netlify/functions/api.ts:8:23:
      8 │ import serverless from 'serverless-http'
        ╵                        ~~~~~~~~~~~~~~~~~

  You can mark the path "serverless-http" as external to exclude it from the bundle, which will
  remove this error.

=============

[danez]

Hmmm, I now also tried on my mac and also works. Maybe your npm cache is broken, but very unlikely. Can try npm cache clean --force && rm -rf ./node_modules && npm i

Are you using the netlify-cli from the project? Or a global installed version and is this the latest version?

[hrishikesh-k]

Interesting. I tried in an Ubuntu VM I had set up previously, but never really used. It works correctly as expected. I tried: npm cache clean --force && rm -rf ./node_modules && npm i on my macOS and it still fails with the exact problem. Not sure where to go from here, but at least it's a me problem at this point and not a CLI issue.

Thanks for looking into this.

[hrishikesh-k]

This is possibly related to: evanw/esbuild#2261

[hrishikesh-k]

I changed node_bundler = "zisi" in my netlify.toml and I was able to get this working. However, I was then presented with an error:

Cannot use import statement outside a module

which is expected and also exactly why I was trying to use esbuild.

Not sure where to go from here because this doesn't appear to be:

1. Netlify CLI issue
2. Netlify Zip It and Ship It issue
3. esbuild issue

Especially because this will most likely work correctly locally for all of these.

What's interesting it, this was working perfectly fine until a few weeks ago - just before I stopped working on the project due to other priorities. Now that I'm back at this, I'm stuck.

[danez]

Maybe some folders are owned by root/different user? Or maybe disk access is limited for the shell you are running in?

[hrishikesh-k]

I tried chmod -R +rw ./ as well as added "Full Disk Access" to my shell in macOS preferences. This still fails. :(

Will try a reset tomorrow, I believe.

[hrishikesh-k]

I can confirm, resetting the device worked. Now we'll never know what had happened, but glad it's sorted.