Personalizar as definições do gestor de design

Personalize a sua experiência de programador com as definições do gestor de design. As definições incluem o comportamento de arranque predefinido do gestor de design, as definições de código para ficheiros codificados personalizados e o linting de JavaScript.

Para aceder a estas definições:

• Na sua conta da HubSpot, acesse Conteúdo > Design Manager.
• No canto inferior direito, clique em Definições e, em seguida, seleccione Abrir definições.

• Clique no menu pendente Settings para selecionar o tipo de definições que pretende ajustar.
  
  

Configurações gerais

• Abrir o localizador ao iniciar: quando ativado, o localizador à esquerda será aberto quando o gestor de projectos for acedido pela primeira vez.
• Atualizar o pré-visualizador ao mudar de ficheiro: quando ativado, o pré-visualizador do gestor de projectos mostra o ficheiro atualmente selecionado. Active esta definição se pretender pré-visualizar um ficheiro de cada vez.

Definições de código

Aparência

• Tema: o esquema de cores utilizado pelos editores de código.
• Tipo de letra: o tipo de letra principal e o tamanho do tipo de letra utilizados pelo editor de código.

Fonte

• Tamanho do separador: a largura de um carácter de separador quando se prime a tecla de separador no editor de código.
• Unidade de recuo: o número de espaços que um bloco de código deve ser recuado por recuo inteligente.
• Tabulações suaves: Quando activada, a tecla Tab insere caracteres de espaço iguais a Tamanho da tabulação em vez de um carácter de tabulação.
• Recuo inteligente: Quando ativado, as novas linhas seguem o recuo definido a partir da linha anterior.
• Recuo na entrada de formatação: quando ativado, recua a mesma linha na entrada contextualmente sensível. Por exemplo, uma declaração case x:, ou um fecho } serão corretamente indentados quando inseridos.
• Recuo com separadores: quando ativado, o recuo automático provocado pelo recuo inteligente ou pela entrada de formatação utiliza separadores.
• Envolvimento de linhas: quando ativado, as linhas serão envolvidas em vez de requererem deslocação horizontal.
• Fecho automático de parênteses: Quando ativado, o editor de código fecha automaticamente os caracteres de parênteses e aspas, como por exemplo:
  
  () [] {} '' ""
• Fechar etiquetas automaticamente: Quando ativado, o editor de código fecha automaticamente as etiquetas XML.
• Corresponder parênteses: Quando ativado, colocar o cursor junto a um carácter de parênteses realça o parênteses de abertura ou de fecho correspondente.
• Corresponder etiquetas: Quando activada, a colocação do cursor junto a uma etiqueta realça a etiqueta de abertura ou de fecho correspondente.
• Continuar comentários de bloco: Quando ativado, o editor de código continua automaticamente os comentários de bloco ao criar novas linhas.

Definições de linting do JavaScript

• Clique para ativar ou desativar o interrutor Enable ESLint. Quando ativado, o ESLint será executado sobre o JavaScript ao exibir a saída em arquivos codificados.
  
  
• No painel esquerdo, configure as definições do ESLint. Saiba mais sobre como configurar o ESLint.
• No painel direito, uma demonstração JavaScript reflectirá as alterações feitas no painel esquerdo.
• Clique em Restore default eslintrc para restaurar a configuração padrão.