skills.rest
scsm-unrestrict
scsm-unrestrictCOMMUNITY
Explore all skills by this author →
GitHub

frontend-engineering

Reviews and aligns frontend project structure, TypeScript config, build tooling, and quality gates.

1|Updated Aug 18, 2026
Search Tags:#typescript#frontend#dependency management#eslint#engineering#vite#ci
One-click install
npx skills add https://github.com/scsm-unrestrict/dsh-frontend-engineer-agent --skill frontend-engineering-scsm-unrestrict
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-engineering
Source: https://github.com/scsm-unrestrict/dsh-frontend-engineer-agent/tree/main/frontend-engineer/skills/frontend-engineering
Command: npx skills add https://github.com/scsm-unrestrict/dsh-frontend-engineer-agent --skill frontend-engineering-scsm-unrestrict

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Frontend projects drift into inconsistent tooling, weak TypeScript settings, and missing quality gates. This Skill audits the existing setup first, then proposes minimal, justified changes to project structure, build configuration, code style, and dependency management. ## Core Features & Use Cases - Current-State Assessment: Reads package.json, tsconfig, Vite/Webpack/Next configs, ESLint/Prettier setup, and CI workflows before recommending anything, producing a "current state → problem → suggestion" report. - Engineering Standards Guidance: Covers directory organization by feature, strict TypeScript, ESLint + Prettier + husky/lint-staged, Vite/Webpack build tuning, and CI quality gates (lint → typecheck → test → build). - Dependency Hygiene: Uses depcheck, npm/pnpm audit, and duplicate-version analysis to clean up dependencies while respecting lockfiles and existing version policies. - Use Case: When inheriting a legacy React project with no linting and a bloated webpack config, use this Skill to get a prioritized change list with impact and rollback notes for each item. ## Quick Start Ask the agent to review my frontend project's engineering setup and propose a minimal improvement plan for structure, TypeScript, build, and CI.

Frequently Asked Questions about frontend-engineering

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

FAQPage Schema
How do I review a frontend project's engineering setup?▼

Start by reading package.json, tsconfig.json, build configs (Vite/Webpack/Next), ESLint/Prettier settings, and CI workflows. Then produce a current-state to problem to suggestion report, proposing only minimal changes with clear benefits rather than applying generic templates.

What TypeScript settings should a frontend project use?▼

Enable strict mode and consider noUncheckedIndexedAccess based on team acceptance. Avoid bare any by using unknown with narrowing or precise union types, fully type public APIs like component props, and include tsc --noEmit in CI checks.

Should I migrate from Webpack to Vite?▼

Do not switch build tools unilaterally; that decision belongs to the project owner. The right approach is to present a migration cost and benefit analysis covering config changes, plugin compatibility, and build performance, then let the user decide.

How do I find unused or duplicate npm dependencies?▼

Use depcheck to locate unused or missing dependencies, npm ls or pnpm why to trace duplicate versions of the same package, and npm audit or pnpm audit for known vulnerabilities. Always commit the lockfile and explain impact before applying fixes.

What should a frontend CI quality gate include?▼

A baseline CI pipeline runs lint, typecheck, test, and build in that order. Add husky with lint-staged to check only staged files pre-commit, and optionally commitlint with conventional commits if the project adopts that convention.

Related Skills

Explore More Software Engineering Skills→
zhu637882-stackzhu637882-stack

project-init

Generate a monorepo with React/Vite frontend and NestJS or Express backend using pnpm workspaces.

Community
Intermediate
messebmesseb

dangerfile

Enforces configurable Danger rules and CI environment variables on GitHub pull requests via automated checks.

Community
Intermediate
auxi-wardrobeauxi-wardrobe
1

ck:web-testing

Automate web testing with Playwright, Vitest, and k6.

Official
Advanced
legacybridge-techlegacybridge-tech
6

memory-init

Generate Engram memory configuration and starter templates for a project.

Official
Intermediate