CODEWITHSUNDEEP
npmvercelsveltekit
Siddharth Sharma
Siddharth Sharma

Reputation: 1711

Getting npm 401 Auth issue when deploying Sveltekit site to Vercel

When trying to deploy my Sveltekit site to Vercel, I'm getting npm authentication issue. The same was working fine initially when web app was created and pushed to repo.

npm create svelte@latest my-app

After adding some dependencies (DaisyUI and Tailwind css) and doing npm install, it started to give the deployment error.

enter image description here

Here is the project`s package.json

{
    "name": "reactive-tut-site",
    "version": "0.0.1",
    "private": true,
    "scripts": {
        "dev": "vite dev",
        "build": "vite build",
        "preview": "vite preview",
        "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
        "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
    },
    "devDependencies": {
        "@sveltejs/adapter-auto": "^2.0.0",
        "@sveltejs/kit": "^1.5.0",
        "autoprefixer": "^10.4.14",
        "postcss": "^8.4.23",
        "svelte": "^3.54.0",
        "svelte-check": "^3.0.1",
        "tailwindcss": "^3.3.2",
        "tslib": "^2.4.1",
        "typescript": "^5.0.0",
        "vite": "^4.3.0"
    },
    "dependencies": {
        "daisyui": "^2.51.6"
    },
    "type": "module"
}

Svelte config file:

import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/kit/vite';

/** @type {import('@sveltejs/kit').Config} */
const config = {
    // Consult https://kit.svelte.dev/docs/integrations#preprocessors
    // for more information about preprocessors
    preprocess: vitePreprocess(),
    vite: {
        optimizeDeps: {
          entries: []
        }
      },
    kit: {
        adapter: adapter()
    }
};

export default config;

Upvotes: 1

Views: 571

Answers (2)

Cynthia Emeso
Cynthia Emeso

Reputation: 1

TL;DR: I created a .vercelignore file at the root directory and added package-lock.json to it, so vercel build ignores when it deploys, but I still have package-lock.json for local dev.

Discovery Process Below

Deleting my local package-lock.json and pushing this change to trigger a vercel deployment/build fixed the problem.

To check if it was the lock causing the issue, I npm i, to generate a fresh lock and then pushed that to my branch which then failed the remote vercel build!

Something about the presence of my package-lock was failing the remote vercel build as seemed to be forcing it to npmjs authenticate.

FYI: my local npm run build and also CLI vercel build were both successful, so I know the problem was just with the remote vercel build.

Upvotes: 0

Siddharth Sharma
Siddharth Sharma

Reputation: 1711

Removing package-lock.json worked for me, the site got deployed after that. The reason is package-lock.json stores the package resolution registry and I had installed the same with my work machine which is configured for JFrog antifactory. The two solutions were:

  1. Update .npmrc to point to npmjs registry.
  2. Remove package-lock.json. Second option seemed better fit and worked for me. Screenshot of package-lock.json enter image description here

Upvotes: 0

Related Questions