How can I deploy with Vercel?

I’m trying to deploy my app to Vercel. It’s a next.js application. I updated my package.json to have:

    "scripts": {
        "build": "doppler run -- next build",
        "dev": "doppler run -- next dev",
        "doppler-install": "(curl -Ls https://cli.doppler.com/install.sh || wget -qO- https://cli.doppler.com/install.sh) | sh -s -- --no-install --no-package-manager",
        "format": "pretty-quick --staged",
        "lint": "next lint --fix",
        "postinstall": "npm run doppler-install",
        "prepare": "husky install",
        "start": "next start"
    },

When I deploy, however, I get an error:

added 871 packages in 1m
11:02:36.627	
11:02:36.627	118 packages are looking for funding
11:02:36.627	  run `npm fund` for details
11:02:36.656	Detected Next.js version: 12.1.4
11:02:36.663	Detected `package-lock.json` generated by npm 7...
11:02:36.664	Running "npm run build"
11:02:36.963	
11:02:36.964	> wordblot-web@1.2.0 build
11:02:36.964	> doppler run -- next build
11:02:36.964	
11:02:36.969	sh: doppler: command not found
11:02:36.981	Error: Command "npm run build" exited with 127

What am I doing wrong?

Hi @shamoons and welcome to the Doppler community!

While you can use the Doppler CLI when building in Vercel, I’d encourage you to use our Vercel integration. This means you won’t need the Doppler CLI when building in Vercel.

Was there a blog post or docs page that guided you to set up your project in this way?

To get you back on track, here is what I’d suggest for the best secrets management experience with Doppler and Vercel:

Step 1. Set up Vercel syncs in Doppler for all environments, including Development. This is because the vercel dev command you’ll use later pulls variables from the Vercel Development environment.

Step 2. If you haven’t already, install the Vercel CLI to provide proper emulation of Vercel’s serverless environment:

npm i -g vercel
vercel login

Step 3. Link your Vercel application locally by changing into the root of your codebase and run:

vercel link

Step 4. Simplify your package.json as Vercel will now inject the secrets synced from Doppler for the Preview and Production environments:

"scripts": {
  "build": "next build",
  "dev": "next dev",
  "format": "pretty-quick --staged",
  "lint": "next lint --fix",
  "prepare": "husky install",
  "start": "next start"
},

If you want to test builds locally, you can still use the Doppler CLI (e.g. for Production):

doppler run --config prd -- npm run build

Step 5. Then to run your application locally, use the Vercel CLI:

vercel dev

Let me know how you go and sorry for the extra work here. It will be well worth it in the end and is something you can use for every Vercel application.

Cheers,
Ryan

If I have "postinstall": "npm run doppler-install", I assume I still need "doppler-install": "(curl -Ls https://cli.doppler.com/install.sh || wget -qO- https://cli.doppler.com/install.sh) | sh -s -- --no-install --no-package-manager",?

I pieced this together myself, lol. No blog post per se. I am using the Vercel integration, which is awesome! I’ll give your suggestions a spin and see how it goes.

Thanks a ton!

Hi @shamoons,

That’s awesome you’re using the Vercel integration! Best way to go!

Sorry, I did not mean to include your postinstall script.

I recommend removing that and installing the Doppler CLI at the system level which means you don’t need to have a script for installing it for each project.

Let us know if there is something we can improve in our docs and blog posts that would’ve made this process easier for you.