Cli: "netlify dev" is running incorrect command for parcel

[aromalanil]

Describe the bug

netlify dev command is running npm run build insted of npm run dev when parcel bundler is detected.
I noticed that this happens when my build command comes before my dev command in package.json

eg :

"scripts": {
    "build": "parcel build index.html",
    "dev": "parcel index.html",
}

This will trigger npm run build when netlify dev command is run.

"scripts": {
    "dev": "parcel index.html",
    "build": "parcel build index.html",
}

But this will trigger npm run dev when netlify dev command is run.

Expected behaviour

Since parcel has a dev command ( parcel <filename>) which creates a live server, netlify dev should run npm run dev if it is present and npm run build only when dev command is absent.

[monsonjeremy]

I can take a look at this one, would you happen to have an example repo that I can use to replicate (so I don't have to create my own)?

Edit: After a quick look into the code, it doesn't seem this should be fixed for one specific scenario (not everyone uses build as their script, maybe they use dist or something else). Instead I would advise you use the netlify.toml file to override this default behavior for your use case.

[dev]
  framework = "parcel"
  command = "npm run dev"

The above entry in the netlify.toml file should solve your problem!

[aromalanil]

Isn't dev usually the script to run a package in development?

• create-react-app has a dev command
• Parcel has a dev command

So probably the netlify should run the dev command instead of build when we run netlify dev

[monsonjeremy]

@aromalanil It can be the convention yes. Netlify CLI however is attempting to work for all use cases across a vast number of users who may have different conventions so trying to favor certain commands will be difficult to achieve across broad use cases.

Let me show specifically in the code where this happens for context.

First, the CLI uses the concept of detectors to figure out which bundler or tools are used. Here is the one for Parcel:
https://github.com/netlify/cli/blob/1db204e6258ecf85061496745d1cdff56f7bb6f9/src/detectors/parcel.js#L13

What the above code will do is scan the package.json for commands that include parcel. This happens here:
https://github.com/netlify/cli/blob/1db204e6258ecf85061496745d1cdff56f7bb6f9/src/detectors/utils/jsdetect.js#L80

When you run netlify dev it will load the detector and retrieve the commands here:
https://github.com/netlify/cli/blob/1db204e6258ecf85061496745d1cdff56f7bb6f9/src/utils/detect-server.js#L40

The problem here is that in your case the function would be called like so:

chooseDefaultArgs(['build', 'start'])

Which ends up just plucking off the first value and calling npm run build:
https://github.com/netlify/cli/blob/1db204e6258ecf85061496745d1cdff56f7bb6f9/src/utils/detect-server.js#L214

The problem is that there is not an immediately obvious way to handle this edge case without breaking it for some others. What if someone uses build for their dev command, and npm run dist for their build output?

@erezrokah can probably advise a little better here, but I think this is the exact case that the overrides are designed to help with.

[aromalanil]

@monsonjeremy Thanks for the clarification. I thought there were different configurations for different bundlers. Closing this issue.

[monsonjeremy]

No problem, sorry I know it's not ideal to have to write an override but I thought about it for a while and there wasn't any immediately obvious way (given the current logic) to catch this edge case! Sorry!

@erezrokah Feel free to re-open if you think it is worth addressing, I'd be happy to take it if it is!

[erezrokah]

Thank you @monsonjeremy for jumping on this and providing a workaround. I'm going to re-open this as I don't think script order in scripts should impact on how we choose the command to run.

The underlying issue here is that both commands dev and build are matched by the detector's logic and the first one is selected.

I can see several approaches for fixing it:

1. Sort the matched commands by priority - script names come before commands string, e.g. a script named dev has higher priority than a command containing parcel.
2. Add an exclude commands/scripts configuration to detectors, e.g. build should never be matched.
3. Change the matching to a regex to allow more powerful patterns.

[monsonjeremy]

Awesome, I can take a look tonight @erezrokah. Im thinking options 2 or 3 make the most sense in order to not affect the logic of other detectors.

One quick question, these detectors are only used for netlify dev correct? If that's the case it makes it a little easier to build this logic into it.

[erezrokah]

Awesome, I can take a look tonight @erezrokah. Im thinking options 2 or 3 make the most sense in order to not affect the logic of other detectors.

That make sense. Good point.

One quick question, these detectors are only used for netlify dev correct? If that's the case it makes it a little easier to build this logic into it.

Yes they are only used for netlify dev

[monsonjeremy]

@erezrokah I ended up taking a similar approach to option 1, as it seemed to make sense with the current logic. This may have a larger blast radius however, so that's something to consider.

I'm open to changing my approach if you think there is a better one!