Central de conhecimento HubSpot

Personalizar as definições do gestor de design

Written by HubSpot Support | 16/out/2019 20:40:15

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:

  • 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.