Configures VS Code workspaces with optimal settings, extensions, tasks, and debugging for team consistency. Use when users request "VS Code setup", "workspace settings", "team VS Code config", "editor configuration", or "devcontainer setup".
中文简介正在准备中。当前显示原文说明。
查看安装方法安装前可以查看交给 AI 代理的指令内容。
Configure VS Code for optimal team productivity and consistency.
.vscode/
├── settings.json # Workspace settings
├── extensions.json # Recommended extensions
├── tasks.json # Build tasks
├── launch.json # Debug configurations
└── snippets/ # Custom snippets
└── typescript.json
// .vscode/settings.json
{
// Editor settings
"editor.formatOnSave": true,
"editor.formatOnPaste": false,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.organizeImports": "never"
},
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.detectIndentation": false,
"editor.rulers": [100],
"editor.wordWrap": "off",
"editor.minimap.enabled": false,
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs": "active",
"editor.inlineSuggest.enabled": true,
"editor.quickSuggestions": {
"strings": true
},
// Files
"files.trimTrailingWhitespace": true,
"files.insertFinalNewline": true,
"files.trimFinalNewlines": true,
"files.exclude": {
"**/node_modules": true,
"**/.git": true,
"**/.DS_Store": true,
"**/dist": true,
"**/.next": true,
"**/coverage": true
},
"files.watcherExclude": {
"**/node_modules/**": true,
"**/.git/objects/**": true,
"**/dist/**": true,
"**/.next/**": true
},
"files.associations": {
"*.css": "tailwindcss"
},
// Search
"search.exclude": {
"**/node_modules": true,
"**/dist": true,
"**/.next": true,
"**/coverage": true,
"pnpm-lock.yaml": true,
"package-lock.json": true
},
// TypeScript
"typescript.preferences.importModuleSpecifier": "relative",
"typescript.preferences.quoteStyle": "single",
"typescript.suggest.autoImports": true,
"typescript.updateImportsOnFileMove.enabled": "always",
"typescript.inlayHints.parameterNames.enabled": "literals",
"typescript.inlayHints.functionLikeReturnTypes.enabled": true,
"typescript.tsdk": "node_modules/typescript/lib",
// JavaScript
"javascript.preferences.importModuleSpecifier": "relative",
"javascript.preferences.quoteStyle": "single",
"javascript.updateImportsOnFileMove.enabled": "always",
// ESLint
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact"
],
"eslint.workingDirectories": [{ "mode": "auto" }],
"eslint.codeActionsOnSave.mode": "problems",
// Prettier
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[markdown]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.wordWrap": "on"
},
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// Tailwind CSS
"tailwindCSS.experimental.classRegex": [
["clsx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"],
["cn\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"],
["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"]
],
"tailwindCSS.includeLanguages": {
"typescript": "javascript",
"typescriptreact": "javascript"
},
// Git
"git.autofetch": true,
"git.confirmSync": false,
"git.enableSmartCommit": true,
"git.inputValidation": true,
// Terminal
"terminal.integrated.defaultProfile.osx": "zsh",
"terminal.integrated.fontSize": 13,
"terminal.integrated.scrollback": 10000,
// Explorer
"explorer.compactFolders": false,
"explorer.fileNesting.enabled": true,
"explorer.fileNesting.patterns": {
"package.json": "package-lock.json, yarn.lock, pnpm-lock.yaml, .npmrc",
"tsconfig.json": "tsconfig.*.json",
".eslintrc*": ".eslintignore, .prettierrc*, .prettierignore",
"*.ts": "${capture}.test.ts, ${capture}.spec.ts",
"*.tsx": "${capture}.test.tsx, ${capture}.spec.tsx"
},
// Debug
"debug.javascript.autoAttachFilter": "smart",
// Testing
"testing.automaticallyOpenPeekView": "never"
}
// .vscode/extensions.json
{
"recommendations": [
// Essential
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode",
"bradlc.vscode-tailwindcss",
// TypeScript
"ms-vscode.vscode-typescript-next",
"yoavbls.pretty-ts-errors",
// React
"dsznajder.es7-react-js-snippets",
"burkeholland.simple-react-snippets",
// Git
"eamodio.gitlens",
"mhutchie.git-graph",
// Testing
"vitest.explorer",
"orta.vscode-jest",
// Utilities
"streetsidesoftware.code-spell-checker",
"christian-kohler.path-intellisense",
"christian-kohler.npm-intellisense",
"mikestead.dotenv",
"EditorConfig.EditorConfig",
// AI
"github.copilot",
"github.copilot-chat",
// Debugging
"ms-vscode.js-debug-nightly",
// Docker
"ms-azuretools.vscode-docker",
"ms-vscode-remote.remote-containers"
],
"unwantedRecommendations": [
"hookyqr.beautify"
]
}
// .vscode/tasks.json
{
"version": "2.0.0",
"tasks": [
{
"label": "dev",
"type": "npm",
"script": "dev",
"problemMatcher": [],
"isBackground": true,
"presentation": {
"reveal": "always",
"panel": "dedicated"
},
"group": {
"kind": "build",
"isDefault": true
}
},
{
"label": "build",
"type": "npm",
"script": "build",
"problemMatcher": ["$tsc"],
"presentation": {
"reveal": "always"
},
"group": "build"
},
{
"label": "test",
"type": "npm",
"script": "test",
"problemMatcher": [],
"presentation": {
"reveal": "always"
},
"group": "test"
},
{
"label": "test:watch",
"type": "npm",
"script": "test:watch",
"problemMatcher": [],
"isBackground": true,
"presentation": {
"reveal": "always",
"panel": "dedicated"
},
"group": "test"
},
{
"label": "lint",
"type": "npm",
"script": "lint",
"problemMatcher": ["$eslint-stylish"],
"presentation": {
"reveal": "never"
}
},
{
"label": "lint:fix",
"type": "npm",
"script": "lint:fix",
"problemMatcher": ["$eslint-stylish"],
"presentation": {
"reveal": "never"
}
},
{
"label": "typecheck",
"type": "npm",
"script": "typecheck",
"problemMatcher": ["$tsc-watch"],
"presentation": {
"reveal": "silent"
}
},
{
"label": "typecheck:watch",
"type": "shell",
"command": "npx tsc --noEmit --watch",
"problemMatcher": ["$tsc-watch"],
"isBackground": true,
"presentation": {
"reveal": "always",
"panel": "dedicated"
}
}
]
}
// .vscode/launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Next.js: Debug Server",
"type": "node-terminal",
"request": "launch",
"command": "npm run dev",
"serverReadyAction": {
"pattern": "- Local:.+(https?://.+)",
"uriFormat": "%s",
"action": "debugWithChrome"
}
},
{
"name": "Next.js: Debug Full Stack",
"type": "node-terminal",
"request": "launch",
"command": "npm run dev",
"serverReadyAction": {
"pattern": "- Local:.+(https?://.+)",
"uriFormat": "%s",
"action": "debugWithChrome"
}
},
{
"name": "Chrome: Debug Client",
"type": "chrome",
"request": "launch",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack://_N_E/*": "${webRoot}/*"
}
},
{
"name": "Vite: Debug",
"type": "chrome",
"request": "launch",
"url": "http://localhost:5173",
"webRoot": "${workspaceFolder}/src",
"sourceMaps": true
},
{
"name": "Jest: Current File",
"type": "node",
"request": "launch",
"program": "${workspaceFolder}/node_modules/.bin/jest",
"args": [
"${relativeFile}",
"--config",
"jest.config.js",
"--runInBand"
],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen"
},
{
"name": "Vitest: Current File",
"type": "node",
"request": "launch",
"program": "${workspaceFolder}/node_modules/.bin/vitest",
"args": ["run", "${relativeFile}"],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen"
},
{
"name": "Node: Attach",
"type": "node",
"request": "attach",
"port": 9229,
"restart": true
},
{
"name": "Node: Current File",
"type": "node",
"request": "launch",
"program": "${file}",
"runtimeArgs": ["-r", "ts-node/register"],
"console": "integratedTerminal"
}
],
"compounds": [
{
"name": "Full Stack Debug",
"configurations": ["Next.js: Debug Server", "Chrome: Debug Client"]
}
]
}
// .vscode/snippets/typescript.json
{
"React Functional Component": {
"prefix": "rfc",
"body": [
"interface ${1:Component}Props {",
" $2",
"}",
"",
"export function ${1:Component}({ $3 }: ${1:Component}Props) {",
" return (",
" <div>",
" $0",
" </div>",
" );",
"}"
],
"description": "React Functional Component with TypeScript"
},
"React useState": {
"prefix": "us",
"body": [
"const [${1:state}, set${1/(.*)/${1:/capitalize}/}] = useState<${2:type}>($3);"
],
"description": "React useState hook"
},
"React useEffect": {
"prefix": "ue",
"body": [
"useEffect(() => {",
" $1",
" return () => {",
" $2",
" };",
"}, [$3]);"
],
"description": "React useEffect hook"
},
"Console Log": {
"prefix": "cl",
"body": ["console.log('${1:label}:', $2);"],
"description": "Console log with label"
},
"Async Function": {
"prefix": "af",
"body": [
"async function ${1:name}(${2:params}): Promise<${3:void}> {",
" $0",
"}"
],
"description": "Async function"
},
"Try Catch": {
"prefix": "tc",
"body": [
"try {",
" $1",
"} catch (error) {",
" if (error instanceof Error) {",
" console.error(error.message);",
" }",
" throw error;",
"}"
],
"description": "Try catch with proper error handling"
},
"Zod Schema": {
"prefix": "zod",
"body": [
"const ${1:Schema} = z.object({",
" ${2:field}: z.${3:string}(),",
"});",
"",
"type ${1:Schema} = z.infer<typeof ${1:Schema}>;"
],
"description": "Zod schema with type inference"
}
}
// .devcontainer/devcontainer.json
{
"name": "Node.js Development",
"image": "mcr.microsoft.com/devcontainers/typescript-node:20",
// Features to install
"features": {
"ghcr.io/devcontainers/features/github-cli:1": {},
"ghcr.io/devcontainers/features/docker-in-docker:2": {}
},
// Forward ports
"forwardPorts": [3000, 5173],
// Environment variables
"containerEnv": {
"NODE_ENV": "development"
},
// Run commands after container is created
"postCreateCommand": "npm install",
// VS Code settings for container
"customizations": {
"vscode": {
"settings": {
"terminal.integrated.defaultProfile.linux": "zsh"
},
"extensions": [
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode",
"bradlc.vscode-tailwindcss",
"github.copilot"
]
}
},
// Mount volumes
"mounts": [
"source=${localWorkspaceFolder}/.git,target=/workspaces/${localWorkspaceFolderBasename}/.git,type=bind"
],
// User configuration
"remoteUser": "node"
}
# .editorconfig
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = space
indent_size = 2
[*.md]
trim_trailing_whitespace = false
[*.{yml,yaml}]
indent_size = 2
[Makefile]
indent_style = tab
Every VS Code workspace should include:
还没有评价。欢迎分享你的使用感受。
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
Audits and implements web accessibility (a11y) following WCAG 2.1 guidelines with ARIA patterns, keyboard navigation, screen reader support, and contrast checking. Use when users request "accessibility audit", "a11y review", "WCAG compliance", "screen reader support", or "keyboard navigation".
中文简介正在准备中。当前显示原文说明。
Creates Architecture Decision Records documenting key technical decisions with context, alternatives considered, tradeoffs, consequences, and decision owners. Use when documenting "architecture decisions", "technical choices", "design decisions", or "ADRs".
中文简介正在准备中。当前显示原文说明。
Designs multi-step agent workflows with tool usage, retry logic, state management, and budget controls. Provides orchestration diagrams, tool execution order, fallback strategies, and cost limits. Use for "AI agents", "agentic workflows", "multi-step AI", or "autonomous systems".
中文简介正在准备中。当前显示原文说明。
MUST USE when user wants to 调研/research/搜索/search/查/找/look up anything on the internet — e.g. 全网调研 X / 帮我调研一下 X / 查一下 X / 搜搜 X / 看看大家怎么评价 X / X 上有什么讨论 / research this topic。 Also MUST USE when user mentions any platform or shares any URL/链接: 小红书/xiaohongshu/xhs, Twitter/推特/X, B站/bilibili, Reddit, Facebook, Instagram, V2EX, LinkedIn/领英/招聘/求职/jobs, YouTube, GitHub code search, 小宇宙播客, 雪球/股票行情, RSS feeds, or any web URL. 15 platforms, multi-backend routing (OpenCLI / per-platform CLIs / APIs). Zero config for 6 channels. Run `agent-reach doctor --json` to see which backend serves each platform right now. NOT for: 写报告/数据分析/翻译等内容加工（本 skill 只负责从互联网获取内容）； 发帖/评论/点赞等写操作；已有专门 skill 的平台（先用专门 skill）。 【路由方式】SKILL.md 包含路由表和常用命令，复杂场景需按需阅读对应分类的 references/*.md。 分类：search / social (小红书/推特/B站/V2EX/Reddit/Facebook/Instagram) / career(LinkedIn) / dev(github) / web(网页/文章/RSS) / video(YouTube/B站/播客) / finance(雪球/股票)。
中文简介正在准备中。当前显示原文说明。
Orchestrates multi-agent AI systems with task delegation, agent communication, shared memory, and workflow coordination. Use when users request "multi-agent system", "agent orchestration", "AI agents", "agent coordination", or "autonomous agents".
中文简介正在准备中。当前显示原文说明。
Creates SLO-based alerts and operational dashboards with key charts, alert thresholds, and runbook links. Use for "alerting", "dashboards", "SLO", or "monitoring".
中文简介正在准备中。当前显示原文说明。