Comment naviguer dans un projet JavaScript?

9

Je travaille actuellement sur un projet JavaScript utilisant Backbone.js et je me demande comment puis-je naviguer entre les fichiers, en fonction des définitions de méthode et d'objet.

Par exemple, je garde les références à certaines de mes vues dans l'objet global App.Views, et je voudrais être en mesure de naviguer à chaque définition individuelle ( App.Views.Home, App.Views.SomePage, etc.) si je rencontre un. En outre, de nombreuses fermetures sont utilisées pour éviter les fuites d'espace de noms, et je veux savoir comment puis-je suivre automatiquement ces définitions.

J'ai vu ternmais il n'y a pas beaucoup d'exemples sur la façon de le configurer donc je n'ai pas pu faire grand chose.

Quels sont les bons outils pour cela?

init-file javascript tern caisah
la source
1
"... mais il n'y a pas beaucoup d'exemples sur la façon de le configurer ..." - Sous la rubrique "Documentation" sur la ternpage d'accueil, il est dit "Le manuel de référence devrait être votre premier arrêt pour comprendre comment utiliser Tern. " Au moins, ils sont honnêtes oO
itsjeyd

Réponses:

8

Je recommanderais absolument la sterne. Je l'ai découvert à mi-chemin de mon stage (travaillant dans Node.js) l'été dernier, et cela a fonctionné à merveille avec company-modeet js2-mode.

js2-modeen soi est assez puissant. Il peut gérer le M-.saut habituel dans un fichier la plupart du temps, et le terncomplète bien avec le saut inter-fichier / module (en particulier dans l'écosystème de nœuds).

La première étape de l'utilisation de tern est l'installation du binaire. J'ai personnellement utilisé npm pour le faire:

$ sudo npm install -g tern

Installez ensuite dans Emacs. La section pertinente de mon init.elest:

;;; tern
(package-require 'tern)
(add-hook 'js2-mode-hook (lambda () (tern-mode t)))

La dernière étape consiste à configurer un .tern-projectfichier dans le répertoire racine de votre projet . Pour les projets Node.js, je l'utilise comme point de départ:

{
    "loadEagerly": [
        "src/**.js"
    ],
    "plugins": {
        "node": {
        }
    }
}

Si vous utilisez company-mode, l'installation company-ternest également fortement recommandée:

(package-require 'company-tern)
(eval-after-load 'company
    '(add-to-list 'company-backends 'company-tern))

Comme note, j'ai eu quelques problèmes avec le serveur sterne qui mourait occasionnellement l'été dernier (2014). L'exécution des éléments suivants l'a corrigé de manière cohérente:

M-: (delete-process "Tern") RET

Je n'étais pas en mesure de comprendre exactement ce qui en était la cause, mais cela arrivait assez rarement pour être un peu plus qu'une nuisance.

Références:

J David Smith
la source
Cela ressemble à peu près à la configuration que j'ai obtenue. Le fait est que je suis presque toujours invité à ne pas trouver de définition . C'est pourquoi j'ai pensé qu'il y avait peut-être quelque chose de mal avec ma configuration. Par exemple, dans un fichier que j'ai app.eventBus = _({}).extend(Backbone.Events);et dans un autre que j'ai app.eventBus.trigger("changeURL","");. Mais quand je le fais tern-find-definitionpour mon dernier, eventBusje n'ai aucune définition trouvée . Y a-t-il quelque chose que je fais mal ou qui ternne soutient tout simplement pas le type de comportement que j'imagine que cela soutiendrait?
caisah
Avec certains frameworks frontaux, il a des problèmes. Il était presque toujours incapable de comprendre quoi faire avec Angular (bien que j'évite les bits angulaires et n'essaie pas de comprendre comment le faire fonctionner avec eux). Si les fichiers ne se référencent pas via des appels de style RequireJS, vous devrez faire plus de recherches. On dirait que quelqu'un l'a fait fonctionner (?) Mais je n'ai pas assez d'expérience avec ça pour le dire.
J David Smith