Como organizar projetos no VS Code com workspaces e profiles

Introdução aos Workspaces e Profiles no VS Code

O Visual Studio Code é uma das ferramentas mais populares para desenvolvimento, mas sua verdadeira potência é revelada quando você domina workspaces e profiles. Workspaces multi-root permitem que você agrupe múltiplas pastas de projetos em uma única janela, ideal para arquiteturas de microsserviços, monorepos ou projetos que dependem de bibliotecas locais. Já os profiles oferecem isolamento completo de configurações, extensões e atalhos, permitindo que você tenha ambientes específicos para front-end, back-end, ciência de dados, entre outros.

A diferença fundamental é: um workspace organiza pastas e configurações compartilhadas, enquanto um profile isola o ambiente do editor como um todo. Workspaces podem ser locais (apenas uma pasta) ou multi-root (várias pastas). Profiles são independentes e podem ser aplicados a qualquer workspace.

Criando e Gerenciando Workspaces Multi-root

Passo a passo para adicionar múltiplas pastas

  1. Abra o VS Code
  2. Vá em File > Add Folder to Workspace
  3. Selecione as pastas desejadas (ex: api, web, shared-lib)
  4. Salve o workspace em File > Save Workspace As

Exemplo de estrutura de um arquivo .code-workspace:

{
  "folders": [
    {
      "path": "api"
    },
    {
      "path": "web"
    },
    {
      "path": "shared-lib"
    }
  ],
  "settings": {
    "editor.fontSize": 14,
    "files.exclude": {
      "**/node_modules": true
    }
  }
}

Configurações específicas por workspace

Workspaces multi-root herdam configurações do usuário, mas permitem sobrescrevê-las. Exemplo de settings.json dentro do workspace:

{
  "eslint.workingDirectories": [
    { "pattern": "./api" },
    { "pattern": "./web" }
  ],
  "typescript.tsdk": "./api/node_modules/typescript/lib"
}

Tarefas (tasks) também podem ser configuradas por workspace. Exemplo de tasks.json:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Build all",
      "type": "shell",
      "command": "npm run build --workspaces",
      "group": {
        "kind": "build",
        "isDefault": true
      }
    }
  ]
}

Configuração de Profiles para Diferentes Contextos de Projeto

Criação de profiles

Para criar um profile:

  1. Abra a paleta de comandos (Ctrl+Shift+P)
  2. Execute Preferences: Create Profile
  3. Dê um nome (ex: "Front-end Developer", "Back-end Developer")
  4. Escolha se deseja copiar configurações existentes

Exemplo de profile para front-end:

- Nome: Front-end Developer
- Extensões: ESLint, Prettier, Tailwind CSS IntelliSense, React Developer Tools
- Tema: Material Theme Ocean
- Atalhos: Ctrl+Shift+F para formatação automática

Exemplo de profile para data science:

- Nome: Data Science
- Extensões: Jupyter, Python, Pylance, Data Wrangler, Rainbow CSV
- Tema: GitHub Dark Dimmed
- Atalhos: Ctrl+Enter para executar célula Jupyter

Atribuição de extensões por profile

Cada profile mantém seu próprio conjunto de extensões. Para gerenciar:

- Profile ativo: Front-end Developer
- Extensões habilitadas: 15
- Extensões desabilitadas globalmente: 3

Para alternar entre profiles rapidamente:

- Atalho: Ctrl+Shift+P > "Profile: Switch Profile"
- Ou use o seletor no canto inferior esquerdo da barra de status

Organizando Tarefas (Tasks) e Debugging por Workspace

Configuração de tasks por workspace

Em workspaces multi-root, tasks podem ser definidas globalmente ou por pasta. Exemplo de tasks.json global:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Test API",
      "type": "shell",
      "command": "cd api && npm test",
      "problemMatcher": []
    },
    {
      "label": "Test Web",
      "type": "shell",
      "command": "cd web && npm test",
      "problemMatcher": []
    },
    {
      "label": "Deploy All",
      "dependsOn": ["Test API", "Test Web"],
      "dependsOrder": "sequence"
    }
  ]
}

Debugging multi-root

Para debug em projetos interdependentes, configure o launch.json na raiz do workspace:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug API",
      "type": "node",
      "request": "launch",
      "cwd": "${workspaceFolder}/api",
      "runtimeExecutable": "npm",
      "runtimeArgs": ["run", "dev"],
      "port": 9229
    },
    {
      "name": "Debug Web",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceFolder}/web/src"
    },
    {
      "name": "Debug Both",
      "type": "node",
      "request": "launch",
      "preLaunchTask": "Start All Services",
      "compounds": [
        {
          "name": "API + Web",
          "configurations": ["Debug API", "Debug Web"]
        }
      ]
    }
  ]
}

Variáveis de workspace em tasks

Use variáveis como ${workspaceFolder}, ${workspaceRootFolderName}, ${relativeFile} para scripts dinâmicos:

{
  "label": "Lint current project",
  "type": "shell",
  "command": "cd ${workspaceFolder} && npx eslint .",
  "presentation": {
    "reveal": "always"
  }
}

Compartilhando e Versionando Configurações de Workspace

Boas práticas para versionamento

Inclua o arquivo .code-workspace no repositório, mas tome cuidado com informações sensíveis:

# .gitignore
.vscode/settings.json  # ignorar configurações locais
.vscode/launch.json    # pode conter caminhos absolutos

Estrutura recomendada no repositório:

meu-projeto/
├── api/
├── web/
├── shared-lib/
├── .vscode/
│   ├── tasks.json
│   ├── launch.json
│   └── settings.json  (apenas configurações compartilháveis)
└── meu-projeto.code-workspace

Separando configurações sensíveis

Use settings.json local (não versionado) para:

{
  "remote.SSH.remotePlatform": {
    "servidor-producao": "linux"
  },
  "git.path": "/usr/local/bin/git"
}

E o settings.json do workspace (versionado) para:

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "files.trimTrailingWhitespace": true
}

Sincronização de profiles entre máquinas

Use a extensão Settings Sync para sincronizar profiles:

1. Instale "Settings Sync" no VS Code
2. Faça login com GitHub
3. Execute "Sync: Upload Settings" no perfil atual
4. No outro computador, execute "Sync: Download Settings"
5. Os profiles serão restaurados com extensões e configurações

Dicas Avançadas e Automação com Workspaces e Profiles

Atalhos para alternar entre profiles

Crie atalhos personalizados no keybindings.json:

[
  {
    "key": "ctrl+alt+1",
    "command": "workbench.action.switchProfile",
    "args": { "profile": "Front-end Developer" }
  },
  {
    "key": "ctrl+alt+2",
    "command": "workbench.action.switchProfile",
    "args": { "profile": "Back-end Developer" }
  },
  {
    "key": "ctrl+alt+3",
    "command": "workbench.action.switchProfile",
    "args": { "profile": "Data Science" }
  }
]

Comandos integrados úteis

  • Developer: Reload Window with Extensions Disabled — para testar performance
  • Developer: Inspect Editor Tokens and Scopes — para temas e highlighting
  • Workspaces: Open Workspace Configuration File — acesso rápido ao .code-workspace

Integração com GitHub Copilot por workspace

Configure snippets inteligentes por workspace:

{
  "github.copilot.enable": {
    "*": true,
    "plaintext": false,
    "yaml": false
  },
  "github.copilot.editor.enableAutoCompletions": true
}

E para snippets específicos de projeto:

{
  "editor.snippetSuggestions": "top",
  "editor.suggest.snippetsPreventQuickSuggestions": false
}

Conclusão

Workspaces e profiles no VS Code transformam a maneira como você organiza projetos complexos. Workspaces multi-root permitem gerenciar múltiplos projetos em uma única janela, com configurações, tasks e debug unificados. Profiles oferecem ambientes isolados para diferentes contextos de desenvolvimento, evitando conflitos de extensões e personalizações.

A combinação dessas ferramentas é especialmente poderosa em cenários como:
- Monorepos com front-end, back-end e shared packages
- Projetos que exigem diferentes ferramentas de linting ou formatação
- Desenvolvedores que trabalham com múltiplas linguagens ou frameworks
- Equipes que precisam de configurações padronizadas e versionadas

Comece criando um workspace multi-root para seu próximo projeto e experimente profiles para separar seus ambientes de desenvolvimento. A produtividade ganha é imediata.

Referências