Search code examples
netlifyvuepress

Netlify breaks after adding netlify.toml file

We are running a quite simple setup where we have a Vuepress project that is built using yarn build which relates to vuepress build. It all worked pretty great so far (first time netlify user)

We now wanted an environment variable in production builds. To do so, I added a netlify.toml that looks like the following:

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

I do not know why, but suddenly the build on the main branch (which is our production build) breaks because yarn cannot find the vuepress command anymore.

This worked fine before the introduction of the netlify.toml (and still works fine for non-production branches)

The build log looks like:

3:04:22 PM: $ yarn docs:build
3:04:22 PM: yarn run v1.22.10
3:04:22 PM: $ vuepress build docs --clean-cache --clean-temp
3:04:22 PM: /bin/sh: 1: vuepress: not found
3:04:22 PM: error Command failed with exit code 127.
3:04:22 PM: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Solution

  • This is a common issue on Netlify when people want to use NODE_ENV to make decisions for their builds with custom build scripts, etc.

    By default the build bots on Netlify set NODE_ENV to development, so yarn will install the dev dependencies.

    If vuepress is in your devDependencies, yarn will ignore them when Netlify runs the yarn install automatically. There are a couple work arounds.

    • use: NODE_ENV=development yarn install && yarn docs:build
    • use: yarn add vuepress && yarn docs:build
    • remove the env variable setting if you don't need it. If you need to know if it is a production build, you can always use CONTEXT which is set by Netlify on a production build.

    There are some other options, but I'll leave it here for brevity.