feat(command-dev): support base configuration

[swyxio]

- Do you want to request a feature or report a bug?
feature

- What is the current behavior?
we dont support base: https://www.netlify.com/docs/netlify-toml-reference/

report back to https://twitter.com/JTParrett/status/1126542833467498497 when done

[matuella]

Are there any alternatives for running a netlify dev that is inside a monorepo?
Like, I was wondering if it's possible to test all of the redirects and other properties in netlify.toml, even if the base is not supported.

I.e:

netlify.toml
ui
- package.json
server
- package.json

[devuxer]

Just ran into this. It took a lot of tinkering, but I think I've got both Netlify Dev and CI deploys working. Edit: after further testing, I question my sanity on the day I thought I had this working. (see followup comments below).

My project directory looks something like this:

web-app/
├── .git/
├── back-end-stuff/
├── netlify-functions/
│     ├── build/
│     ├── src/
│     ├── package.json
│     └── tsconfig.json
├── web/
│     ├── src/
│     ├── gatsby-config.js
│     ├── package.json
│     └── tsconfig.json
├── netlify.toml
└── package.json

And here's my netlify.toml:

[build]
    base = "web"
    publish = "public"
    functions = "netlify-functions/build"

[dev]
    framework = "#custom"
    command = "npm run build-web"
    targetPort = 8000

And here's the scripts section of my root package.json:

"scripts": {
    "netlify-dev": "netlify dev",
    "build-web": "cd web && npm run develop"
}

Hopefully this helps someone out, but it would be cleaner and a lot less confusing if this issue were addressed (i.e., "base" were supported for Netlify Dev, not just for builds).

[mjswensen]

Running into this, too. Unfortunately I wasn't able to get @devuxer 's magical incantation to work for my particular repository setup (though it was helpful during investigation, thank you!).

Current workaround is to temporarily move files around for dev, use a couple of commands to get everything up and running, and be careful what I commit and push. Then use preview deploys to validate manually before merging to master for production deploy.

Seems like the docs are mismatched somewhat with the UI as well—for example, the file-based configuration docs show the functions folder including the base directory, but if you have to omit the base directory if you specify the functions folder in the UI, otherwise it gets added twice.

[devuxer]

@mjswensen , Sorry to mislead you. I was wrong. I believe my solution above only works in production. To use with netlify dev, I'm finding I need to have an extra copy of my built functions at web/netlify-functions/build.

[mjswensen]

@devuxer No worries at all. I’ve been poking at this thing off and on for a few days and just can’t quite find a combination that works well for both dev and production. Looks like you’re in the same boat.

[devuxer]

@mjswensen, Another workaround appears to be just commenting out base = "web" from netlify.toml when testing in development. The downside of this is of course the risk of forgetting to uncomment it when pushing to production.

[RaeesBhatti]

@devuxer Can you please share your netlify.toml that works in production!

[devuxer]

@RaeesBhatti,

Thanks for chiming in. To be honest, I don't know what I did that day where I thought I had everything working 🤷‍♂️

What I'm finding now is that, if I don't define a base directory, the functions directory is correct, but I can't get Gatsby to build, and if I do define a base directory, the functions directory is incorrect, but Gatsby builds properly.

I tried functions = "../netlify-functions/build/" but that didn't work.

It would really help if functions, which are conceptually back-end microservices, were not considered part of the UI and could have their own build command on the server (so we didn't have to commit compiled code to the repo).

[devuxer]

Okay, I think I've gotten to a "good enough" solution for now. Still in the process of testing various aspects of this, but it at least appears that both my Gatsby site and functions are now building and showing up in both https://app.netlify.com/sites/[my-app]/functions as well as Netlify Dev.

Here's my current netlify.toml file:

[build]
    base = "web"
    publish = "public"
    functions = "netlify-functions"
    command = "npm install --global shx && npm install --prefix ../netlify-functions && npm run build --prefix ../netlify-functions && npm run build"

[dev]
    framework = "#custom"
    command = "npm run build --prefix netlify-functions && npm run develop --prefix web"
    targetPort = 8000

Here's what the production command does:

1. Installs shx globally (to allow for sh calls regardless of platform)
2. Installs node modules for /netlify-functions
3. Runs a build process that compiles all function files (which are written in TypeScript), then for each function, runs a little node script that...
   1. Assembles the resulting JavaScript plus a package.json and package-lock.json file into a folder
   2. Installs node modules for each folder
   3. Copies the folder to web/netlify-functions
4. Runs gatsby build for /web

The development command is a little simpler since it assumes shx and /netlify-functions dependencies have already been installed. Also, due to base not really working for dev, the --prefix flags are different.

I also tried to use netlify-lambda, but I frankly couldn't get it to work (I don't remember the errors I was getting, but I ultimately decided it would just be easier to roll my own solution).

[mjswensen]

Thanks for looking into this, @devuxer . I didn't know about npm's --prefix flag before—very handy for this situation.