Lovable and Let's Encrypt integration: Step-by-Step Guide 2025

 

Step: Adding Required Dependencies into Your Project

 

Since Lovable doesn’t offer a terminal, you need to add dependency declarations directly into your project’s configuration file. Open your project’s package.json file and add the following dependencies. This tells Lovable to include the automatic Let’s Encrypt certificate management package.

{
  "name": "lovable-project",
  "version": "1.0.0",
  "dependencies": {
    "express": "^4.18.2",
    "greenlock-express": "^4.0.0"
  },
  "scripts": {
    "start": "node dist/main.js"
  }
}

Make sure to save this file in the root directory of your project.

 

Step: Creating the Certificate Manager Module

 

Create a new file named certManager.ts in your source code folder. This module will configure and initialize Let’s Encrypt using the greenlock-express library. Paste the following code into certManager.ts:

// Import the greenlock-express module
import * as GreenlockExpress from 'greenlock-express';

export const createGreenlock = () => {
    return GreenlockExpress.create({
        // Add your email address for renewal notifications
        email: '[email protected]',
        // Agree to the Let's Encrypt Subscriber Agreement
        agreeTos: true,
        // The domains you want the certificate for
        approvedDomains: ['example.com'],
        // Set the config directory for certificates (if applicable)
        configDir: './greenlock.d',
        // Use the staging server for testing. Change to 'https://acme-v02.api.letsencrypt.org/directory' for production.
        server: 'https://acme-staging-v02.api.letsencrypt.org/directory',
        // Whether or not to run in debug mode
        debug: false
    });
};

Replace the email and the approvedDomains with your specific details. This module sets up Greenlock to automatically manage certificate issuance and renewal.

 

Step: Modifying Your Main Server Code to Use Let’s Encrypt

 

Open your main server file (for example, main.ts). Import the Express module and the certificate manager module you just created. Then modify the server startup code so that greenlock-express handles the HTTPS configuration. Insert the following code into your main.ts:

import express from 'express';
import { createGreenlock } from './certManager';

// Create your Express application
const app = express();

// Define your routes and other middleware
app.get('/', (req, res) => {
    res.send('Hello from Lovable with Let's Encrypt!');
});

// Create the Greenlock instance for automatic SSL/TLS handling
const greenlock = createGreenlock();

// Start the HTTPS server using Greenlock
greenlock.listen(80, 443, function () {
    console.log("Listening for ACME challenges on ports 80 and 443...");
});

This code sets up an Express server and then uses the greenlock-express instance to listen on both HTTP (port 80) and HTTPS (port 443). Greenlock will automatically handle obtaining and renewing certificates from Let’s Encrypt.

 

Step: Finalizing Your Project Setup

 

After adding the above files, ensure your project’s build process (if you have one) compiles your TypeScript code into JavaScript. Verify that your tsconfig.json is correctly configured to compile files from your source directory (usually src) into a designated output directory (for example, dist).

For example, a basic tsconfig.json might look like this:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "outDir": "./dist",
    "strict": true,
    "esModuleInterop": true
  },
  "include": ["./*/.ts"],
  "exclude": ["node_modules"]
}

Lovable will use the built files to run your project. If your project does not perform TypeScript compilation automatically, make sure to include a build step in your project settings or configure Lovable to use the provided package.json start script.

 

Usage and Testing

 

Once all the above changes are in place, save every file and instruct Lovable to run your project (using the provided start script in package.json). Greenlock-express will then manage the ACME HTTP challenge on port 80 and serve HTTPS traffic on port 443 using Let’s Encrypt certificates.

Visit your domain (for example, https://example.com) to verify that your project is running with valid SSL/TLS certificates from Let’s Encrypt.