vue-layer-test

Generate Vue 3 Vitest and E2E test configurations from CONFIG settings.

Updated Mar 16, 2026
One-click install
npx skills add https://github.com/limkyulee/front-skills --skill vue-layer-test
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vue-layer-test
Source: https://github.com/limkyulee/front-skills/tree/main/.opencode/vue-framework/vue-layer-test
Command: npx skills add https://github.com/limkyulee/front-skills --skill vue-layer-test

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Vue projects often lack a cohesive testing bootstrap, requiring manual setup of Vitest unit tests and E2E configurations across frameworks. This Skill automates the creation of test infrastructure, configuration files, and sample tests tailored to CONFIG.

Core Features & Use Cases

  • Generate Vitest configuration (vitest.config.ts) and scaffolding for unit tests under src/tests and component/composable samples.
  • Create E2E configurations for Cypress, Playwright, or Nightwatch based on CONFIG.e2e, including example test files and supporting config files.
  • Update package.json scripts and install necessary testing dependencies automatically according to the selected configuration.

Quick Start

Invoke the skill with a request like '테스트 설정 추가해줘' to generate the complete Vue testing setup according to your project's CONFIG.

Frequently Asked Questions about vue-layer-test

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

FAQPage Schema
How do I set up Vitest unit tests in a Vue 3 project?

Vitest unit test setup in a Vue 3 project requires generating a vitest.config.ts file and scaffolding test samples under src/__tests__. The configuration automatically installs necessary testing dependencies and adds component and composable sample tests to bootstrap the environment.

Can I configure Playwright or Cypress for E2E testing alongside Vitest?

Yes, you can configure Playwright or Cypress for E2E testing alongside Vitest. The setup generates E2E framework configurations based on your selected setting, creating example test files and supporting config files while updating package.json scripts to run both unit and E2E tests.

What is the best way to scaffold a complete Vue 3 testing environment?

The best way to scaffold a Vue 3 testing environment is to automate the creation of test infrastructure. This generates Vitest and E2E configuration files, updates package.json scripts, and installs required testing packages based on your specified configuration settings.

Does Vue 3 test scaffolding support Nightwatch as an E2E framework?

Yes, Vue 3 test scaffolding supports Nightwatch as an E2E framework. You can select Nightwatch from the E2E configuration options, which will generate the supporting framework configurations, create example test files, and install the necessary dependencies automatically.

Why do I need to update package.json scripts when adding Vue test layers?

You need to update package.json scripts when adding Vue test layers to define executable commands for running both unit and E2E tests. Automating this update ensures the newly installed Vitest and E2E dependencies are correctly wired into your project's standard npm run workflows.