skills.rest
isamu
isamuCOMMUNITY
Explore all skills by this author →
GitHub

add-page

Generate Vue page components, router config, and English and Japanese i18n keys.

45|3|Updated Feb 26, 2021
Search Tags:#vue#i18n#internationalization#page creation#router configuration
One-click install
npx skills add https://github.com/isamu/firebase-vue3-startup-kit --skill add-page-isamu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: add-page
Source: https://github.com/isamu/firebase-vue3-startup-kit/tree/main/.claude/skills/add-page
Command: npx skills add https://github.com/isamu/firebase-vue3-startup-kit --skill add-page-isamu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the process of adding a new Vue page to a project with internationalized routing. It automates the creation of views, routes, and i18n keys, reducing manual configuration.

Core Features & Use Cases

  • Automated Page Creation: Automatically generates the necessary Vue component and router configuration for a new page.
  • Internationalization: Handles i18n routing by creating keys for English and Japanese in the project's i18n files.
  • Use Case: For developers looking to add a new page with multi-language support quickly, without manually writing routing and i18n configuration.

Quick Start

Use the 'add-page' skill to create a new page named 'about' with English and Japanese support.

Frequently Asked Questions about add-page

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

FAQPage Schema
How do I add a new Vue page with internationalized routing?▼

To add a new Vue page with internationalized routing, use the 'add-page' skill to automatically generate the Vue component, router configuration, and i18n key entries for English and Japanese simultaneously.

How does i18n URL-path routing work for multi-language Vue pages?▼

i18n URL-path routing maps distinct URL paths to localized content. This skill automates that mechanism by injecting corresponding English and Japanese i18n keys into your translation files when a new page is created.

What is the best way to scaffold a Vue component and router configuration for multi-language support?▼

The best way to scaffold a Vue component and router configuration for multi-language support is to use an automated generator, which prevents manual misconfiguration by creating the view, routes, and i18n keys together.

Can I use this to create i18n keys for languages other than English and Japanese?▼

This skill specifically generates i18n keys for English and Japanese. You would need to manually add translations for any additional languages after the automated page creation is complete.

Do I need to manually configure Vue router paths after generating a new page?▼

No, you do not need to manually configure Vue router paths. The skill automatically outputs the necessary router configuration alongside the Vue component and i18n entries during the scaffolding process.

Related Skills

Explore More Software Engineering Skills→
KanbanGuidesKanbanGuides
11

guide.transcreate

Generate Hugo configuration, i18n files, and content structures for new languages.

Official
Intermediate
modrinthmodrinth
2.3k

i18n-pass

Convert hard-coded English strings in Vue files to the @modrinth/ui i18n system.

Official
Intermediate
Aditya07024Aditya07024

clerk-vue-patterns

Implement Vue 3 Clerk authentication with composables, router guards, and Pinia stores.

Community
Intermediate
hector-mannyhector-manny

ui-to-vue

Convert design screenshots to Vue 3 components using specified UI libraries.

Community
Advanced