Vite + React Build and Deploy job github action cannot create certificate during 'vite build'. (failed to load config from /github/workspace/vite.config.js)

[travisrbe]

I am trying to deploy a site to Azure static web apps.

I used the Azure portal to create a new Static Web App, and configured the portal options to use my github repo as shown here:

As expected, upon creation of the resource in Azure, a workflow yml file was automatically generated in GitHub, and the job ran but failed.

(I ran into an issue with Node versioning, but was able to resolve that error by being explicit in my package.json file.)

During the Build and Deploy step, I am getting the following error message:

failed to load config from /github/workspace/vite.config.js
error during build:
Error: Could not create certificate.
at file:///github/workspace/vite.config.js.timestamp-1711659903508-baa8584510e9a.mjs:27:11
(...at etc...)

The portion of the vite.config.js file throwing this error (out-of-the-box code):

const baseFolder =
env.APPDATA !== undefined && env.APPDATA !== ''
? ${env.APPDATA}/ASP.NET/https
: ${env.HOME}/.aspnet/https;

const certificateName = "MyAppName";
const certFilePath = path.join(baseFolder, ${certificateName}.pem);
const keyFilePath = path.join(baseFolder, ${certificateName}.key);

if (!fs.existsSync(certFilePath) || !fs.existsSync(keyFilePath)) {
if (0 !== child_process.spawnSync('dotnet', [
'dev-certs',
'https',
'--export-path',
certFilePath,
'--format',
'Pem',
'--no-password',
], { stdio: 'inherit', }).status) {
throw new Error("Could not create certificate.");
}
}

I threw in a couple of logging messages to check that the certFilePath value was being generated in a sane way - looks fine to me but I don't know for certain that it is correct. It's showing: /github/home/.aspnet/https/MyAppName.pem - is this right?

Can anyone tell me either why this is happening, or how I can debug this issue?

[JasonETucker]

I have the same problem here as well

[PocPhot]

I have the same problem
Have you solved that problem yet?

[travisrbe]

No. :(

[psiservices-gene-croy]

ran into this issue building in docker. added the following before build/publish

RUN mkdir -p ~/.aspnet/https

[jhudsoncedaron]

Confirmed. It's probably a .NET build tools bug, but oof.

[John-PS]

just started seeing this issue yesterday. Testing this fix

[natanaeladit]

thanks! it solved the issue

[ggselectquote]

Confirmed this is a .NET8 build issue.

If you're in Docker, follow @psiservices-gene-croy instructions.

Pin to the previous release of the dotnet sdk if you do not have access to ~/ (e.g., pipelines), otherwise perform a custom install and create the directory as instructed.

Example
https://learn.microsoft.com/en-us/dotnet/core/install/linux-scripted-manual#scripted-install

mkdir -p ./dotnet-sdk
wget https://dot.net/v1/dotnet-install.sh -O dotnet-install.sh 
chmod +x dotnet-install.sh
./dotnet-install.sh --version 8.0.402 --install-dir ./dotnet-sdk

[MichaMican]

We were able to fix this by pinning the dotnet sdk version as @ggselectquote suggested.

Incase someone has the same problem update your action.yml accordingly:

- name: Setup .NET Core
  uses: actions/setup-dotnet@v4
  with:
    dotnet-version: 8.0.402

-> Version >= 8.0.403 are affected by this bug

[travisrbe]

I am traveling and cannot test until next week, but thank y'all so much for reviving this issue. I'll make sure I credit you the answers.

[StefanH114]

Same issue on my side

[benmatela]

The solution for me was a good old vite.config.ts refactor.
Removed everything related to certificates and left with the minimal setup. But again it's not a prod app so I'll see how far I get.

import { fileURLToPath, URL } from "node:url";
import { defineConfig } from "vite";
import plugin from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [plugin()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
  server: {
    port: 3000,
    host: true,
  },
});

[ChumboMJ]

I recently battled with this because I was starting with a fresh development machine and wrote a quick Gist describing the issue and how it can be resolved. Thank you to the others in this thread who helped point me in the right direction:

How to Resolve: Visual Studio .NET 8 / .NET 9 React Project vite build "Error: Could not Create Certificate"