App Lock for Nuxt 3

The App Lock module adds a password protection layer to your Nuxt 3 applications, ideal for controlling access during development or quality control (QC) phases. This module is designed to prevent search engines from indexing development sites and to restrict unauthorized access to non-production environments.

• ✨  Release Notes

Features

• Environment-Driven Activation: The lock screen is enabled only when the APP_LOCK_PASSWORD environment variable is set, ensuring that production environments remain unaffected.
• Password Protection: Access to the Nuxt application requires entering a valid password, defined in the environment variable APP_LOCK_PASSWORD.
• Prevention of Indexing and Unauthorized Access: Helps to prevent search engines from indexing development sites and restricts public access to QC or development environments.

Quick Setup

Install the module to your Nuxt application with one command:

npx nuxi module add app-lock

OR

Installation

1. Install the Module

## if you use NPM
npm install app-lock

## if you use PNPM
pnpm add app-lock

2. Configure Nuxt

Add the module to your nuxt.config.ts file:

export default defineNuxtConfig({
  modules: ['app-lock'],
})

Configuration

1. Set the Environment Variable

Define the APP_LOCK_PASSWORD in your .env file to activate the App Lock.

APP_LOCK_PASSWORD=yourpasswordhere

Replace yourpasswordhere with the password you wish to use for accessing your Nuxt application.

Usage

When the APP_LOCK_PASSWORD environment variable is set, the App Lock screen will automatically activate, requiring users to enter the password to access the application. If the variable is not set or is removed, the App Lock screen will not appear, allowing normal access to the application.

Security Note

• This module is intended for use in development and QC environments. Do not rely on it as the sole security measure for sensitive or production environments.
• Always ensure your environment variables are securely managed and not exposed in your application's client-side code.

Contribution

Local development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release