vue-ssr-deployment

Deploy Vue SSR Starter Kit with Docker builds and GitHub Actions pipelines.

3|Updated Jan 14, 2023
One-click install
npx skills add https://github.com/e-xode/vue-ssr --skill vue-ssr-deployment
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vue-ssr-deployment
Source: https://github.com/e-xode/vue-ssr/tree/main/.claude/skills/vue-ssr-deployment
Command: npx skills add https://github.com/e-xode/vue-ssr --skill vue-ssr-deployment

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It helps teams deploy the Vue 3 SSR Starter Kit reliably by standardizing Docker builds, environment switching for remote vs local MongoDB, and production-grade server settings.

Core Features & Use Cases

  • Docker multi-stage production builds: Create a smaller runtime image by building in one stage and copying only the built output into production.
  • MongoDB mode switching with docker-compose: Use docker-compose overrides plus a COMPOSE_FILE toggle in .env to redirect the app from remote MongoDB (e.g., Atlas) to a local mongo container for development.
  • Production hardening and operations: Enforce required secrets (COOKIE_SECRET), apply production Helmet CSP behavior, hide stack traces in production, and perform graceful shutdown on SIGTERM/SIGINT to protect data integrity during container stop/rollouts.
  • CI/CD workflows for quality and delivery: Run CodeQL, lint/test, npm publishing on version tags, and build/push Docker images to GitHub Container Registry (GHCR).

Quick Start

Ask how to build and deploy the Docker image to GHCR while keeping MongoDB pointed at the remote host in production.

Frequently Asked Questions about vue-ssr-deployment

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I deploy a Vue SSR app to Docker using GitHub Actions?

To deploy a Vue SSR app, you can use a CI/CD pipeline with GitHub Actions to run tests, trigger Docker builds, and push images to GitHub Container Registry. This involves multi-stage Docker builds and workflow triggers for linting and publishing.

How do I switch Vue SSR MongoDB connections between local and remote environments?

You can switch MongoDB connections for Vue SSR by using docker-compose overrides and a COMPOSE_FILE toggle in your .env file. This redirects the application from a remote MongoDB like Atlas to a local mongo container for development.

How do I handle graceful shutdown in a Vue SSR Docker container?

Handling graceful shutdown in a Vue SSR Docker container requires intercepting SIGTERM and SIGINT signals. This protects data integrity during container stop or rollouts by allowing the application to finish active requests before terminating.

What production security hardening is needed for a Vue SSR deployment?

Production security for a Vue SSR deployment requires enforcing required secrets like COOKIE_SECRET, applying Helmet CSP behavior, and hiding stack traces. These settings prevent unauthorized access and data leakage in production.

Can I use a multi-stage Docker build for Vue SSR production images?

Yes, you can use a multi-stage Docker build for Vue SSR production images. This creates a smaller runtime image by building the application in one stage and copying only the built output into the production stage.

What CI/CD workflows are needed for Vue SSR release pipelines?

Vue SSR release pipelines require CI/CD workflows for quality and delivery, including CodeQL analysis, npm-test for linting and testing, npm-publish on version tags, and docker-build for pushing images to GHCR.