Lovable deployment

Vite Path Aliases Not Resolving in Build

Import aliases work in development (@/components) but fail in production build. Build fails with 'cannot find module' errors. Aliases not recognized by TypeScript or bundler.

Vite aliases require configuration in both vite.config.js and tsconfig.json. Missing either causes resolution failures.

Error Messages You Might See

Cannot find module '@/components' Unresolved type reference module not found
Cannot find module '@/components'Unresolved type referencemodule not found

Common Causes

  1. Alias defined in vite.config.js but not tsconfig.json
  2. tsconfig.json baseUrl or paths incorrect
  3. Alias path doesn't exist or wrong relative path
  4. TypeScript not finding module even though Vite does
  5. Build using wrong config file

How to Fix It

Configure in both vite.config.js and tsconfig.json:

// vite.config.js
export default {
  resolve: {
    alias: {
      '@': '/src'
    }
  }
}

// tsconfig.json
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

Real developers can help you.

Nam Tran Nam Tran 10 years as fullstack developer Jen Jacobsen Jen Jacobsen I’m a Full-Stack Developer with over 10 years of experience building modern web and mobile applications. I enjoy working across the full product lifecycle — turning ideas into real, well-built products that are intuitive for users and scalable for businesses. I particularly enjoy building mobile apps, modern web platforms, and solving complex technical problems in a way that keeps systems clean, reliable, and easy to maintain. Pratik Pratik SWE with 15+ years of experience building and maintaining web apps and extensive BE infrastructure Jaime Orts-Caroff Jaime Orts-Caroff I'm a Senior Android developer, open to work in various fields Taufan Taufan I’m a product-focused engineer and tech leader who builds scalable systems and turns ideas into production-ready platforms. Over the past years, I’ve worked across startups and fast-moving teams, leading backend architecture, improving system reliability, and shipping products used by thousands of users. My strength is not just writing code — but connecting product vision, technical execution, and business impact. ISHANTDEEP SINGH ISHANTDEEP SINGH Senior Software Engineer with 7+ years of experience in React, JavaScript, TypeScript, Next.js, and Node.js. I’ve also worked as a tech lead for startups, owning end-to-end technical execution including architecture, development, scaling, and delivery. I bring a strong mix of hands-on coding, product thinking, and technical leadership, and I’m comfortable building products from scratch as well as improving and scaling existing systems. Richard McSorley Richard McSorley Full-Stack Software Engineer with 8+ years building high-performance applications for enterprise clients. Shipped production systems at Walmart (4,000+ stores), Cigna (20M+ users), and Arkansas Blue Cross. 5 patents in retail/supply chain tech. Currently focused on AI integrations, automation tools, and TypeScript-first architectures. Stanislav Prigodich Stanislav Prigodich 15+ years building iOS and web apps at startups and enterprise companies. I want to use that experience to help builders ship real products - when something breaks, I'm here to fix it. hanson1014 hanson1014 Full-stack developer experienced in fixing and deploying AI-generated apps from Lovable, Bolt.new, Cursor, and Replit. I specialize in debugging Supabase integration issues (auth flows, RLS policies, database connections), fixing broken deployments, resolving routing/blank screen problems, and cleaning up messy React/Vite codebases. I also build production apps with the Claude API and have shipped a Mac desktop dev tool (Nexterm from scratch. Based in Hong Kong, fast turnaround. Victor Denisov Victor Denisov Developer

You don't need to be technical. Just describe what's wrong and a verified developer will handle the rest.

Get Help

Frequently Asked Questions

Do I need both vite and tsconfig config?

Yes, Vite handles bundling with vite.config.js, TypeScript needs tsconfig.json for type checking.

Can I use multiple aliases?

Yes, define multiple entries in resolve.alias and tsconfig paths. Paths are tried in order.

Related Lovable Issues

Can't fix it yourself?
Real developers can help.

You don't need to be technical. Just describe what's wrong and a verified developer will handle the rest.

Get Help