web-dev-qa-db-fra.com

Existe-t-il un moyen d'obtenir Sublime Text 2 pour compléter automatiquement les attributs HTML?

Je me demandais s'il y avait un moyen d'obtenir Sublime Text 2 pour compléter automatiquement les attributs HTML comme dans Aptana?

editorsublimetext2
36
camara90100

La saisie semi-automatique est activée par défaut lorsque vous utilisez "<" et votre balise, puis appuyez sur Entrée. Donc, si vous entrez <p puis appuyez sur Entrée pour terminer la paire de balises pour vous ... où vous vous retrouverez avec <p></p> et votre curseur sera au milieu. Vous pouvez changer cela en onglet si vous préférez en collant ce qui suit dans vos Préférences -> Paramètres - Fichier utilisateur:

{
    "auto_complete_commit_on_tab": true
}

Cela remplacera la valeur par défaut false pour l'achèvement sur l'onglet. Encore une fois, ce n'est que si vous souhaitez utiliser tab au lieu d'entrer.

36
Valjas

Hé, vous pouvez essayer https://github.com/agibsonsw/HTMLAttributes ou installer un package de contrôle de paquet appelé "HTMLAttributes";). Cela fonctionne pour moi. Par exemple, vous tapez:

<p puis appuyez sur la barre d'espace puis sur ctrl + espace et vous obtenez la liste des attributs.

12
born2fr4g

Vous pouvez essayer d'utiliser le package emmet. Il a été spécialement conçu pour l'achèvement du code html et css. Pour plus d'informations, vous devriez lire la documentation .

11
aga

J'avais le même problème; bien que j'utilise les deux modules d'extension HTMLAttributes et Emmet, aucun ne fournit la fonctionnalité de saisie semi-automatique que je cherchais, similaire à celle de Dreamweaver.

Solution : J'ai trouvé un package appelé SublimeCodeIntel qui fait exactement ce dont j'avais besoin.

Exemple : Je code des e-mails html et je fais beaucoup de CSS en ligne. Objectif final:

  <td style="vertical-align:top;">

Après avoir installé SublimeCodeIntel, j'ai tapé <td style="v et une liste des propriétés CSS commençant par "v" s'affiche.

enter image description here

À l'aide de mes touches fléchées, je sélectionne vertical-align et appuyez sur tab pour confirmer, puis tapez la lettre "t" et une liste de valeurs CSS s'affiche maintenant.

enter image description here

Je sélectionne top puis j'appuie sur tab pour confirmer à nouveau ma sélection.

Remarque: Vous pouvez créer des extraits de code prédéfinis pour Emmet pour des propriétés CSS non définies, mais je voulais quelque chose de "prêt à l'emploi" au lieu d'avoir à a) apprendre à les créer via la documentation (bien que je sois sûr que c'est simple), et b) créer un extrait chaque fois que je tombe sur une propriété/valeur CSS non définie comme vertical-align.

J'espère que cela t'aides.

7
josh1978