Recommandé évolutive AngularJS structure de projet?

Je dirais que l'ensemble de vos points peuvent être facilement réalisée, au moins, sans aucune modification Angulaire.

• être en mesure de séparer les contrôleurs, les directives, les filtres, etc. dans leurs propres dossiers;

cela peut être fait, bien entendu, avec de base Angulaire, comme vous pouvez inclure autant de balises de script avec les contrôleurs/services que vous le souhaitez. Bien sûr, il n'est pas évolutive à tous, donc la meilleure option serait d'utiliser AMD modules, comme RequireJS. C'est l'une des graines qui ont ce genre de configuration: https://github.com/elsom25/angular-requirejs-html5boilerplate-seed

• être en mesure de charger ces fichiers à la demande plutôt que d'en faire le navigateur de charger tout;

Comme pkozlowski suggéré dans les commentaires, il y est déjà et à l'entrée avec une description du problème, vous allez voir que je travaille aussi pour résoudre ce problème, et effectivement eu quelques résultats. J'ai un exemple de travail de chargement des contrôleurs, des modèles et des directives sur demande à l'aide de RequireJS et la résoudre param de la route de configuration.

• être en mesure de communes, inter-composantes du projet (par exemple: directives, des filtres ou des services)

Avoir les points précédents résolues, il pourrait être facilement réalisée à l'aide de RequireJs modules.

---

Je me demandais si à partir d'un agularjs-paresseux-projet de semences serait une bonne idée? Est-il de la demande pour qui? Nous pourrions même aller plus loin et de déplacer les itinéraires des configurations à l'extérieur de la configuration normale, disons que vous avez un point de vue.fichier json (idéalement un service qui répond avec json) avec les vues que vous souhaitez inclure dans votre demande:

{
    "views" : {
        ....
        "account" : {             
             "path" : "/account" //route path
             "name" : "Account", //view name
             "partial" : "views/account/account.html", //partial file
             "controller" : "account/main" //RequireJS module
             "directives" : [ "directives/version", "directives/menu" ] //directives used in the view
        }
        ....
    }
}

Cette façon, vous pouvez:

• développer le point de vue de la séparation et de la construction de l'application basé sur json bootstrap
• ont en commun certaines directives et des composants
• quand bootstrap après la connexion, vous pouvez filtrer les vues que l'utilisateur est autorisé à voir
• tout à l'intérieur de la ngView serait chargé à la demande

Bien sûr, votre demande doit alors être vraiment grand, de sorte qu'à faire tout ce travail supplémentaire aurait fait sens 😉

Je suis d'accord avec les points de d'autres gens ont dit jusqu'à présent; il est très facile de diviser les choses en modules distincts et ont des modules dépendent les uns des autres avec des régulière AngularJS choses. Puis votre code JS peuvent être divisés en tous les fichiers et répertoires que vous préférez.

Juste pensé que je voudrais vous parler de ce que nous faisons dans l'open source hawtio projet, qui repose sur AngularJS. Nous avons pris la modularité pour un peu d'un extrême 🙂 hawtio utilise les plugins qui peut être découvert lors de l'exécution dans le serveur en cours d'exécution (par exemple, de déployer et d'annuler le déploiement de l'INTERFACE utilisateur fonctions au moment de l'exécution). Après quelques RESTE de la requête ou de JMX de détection on peut dynamiquement et ou supprimer des plugins.

par exemple, voici tous nos courant par défaut des plugins

En termes de mise en page, chaque plugin a ses propres répertoires de code (js, html partiels (html) et rien d'autre (par exemple css /img répertoires) qui le rend facile de garder de belles choses et modulaire. par exemple, voici la chameau plugin qui a son propre code html, js et img dossiers.

Puis un plugin spécifique définit ses propres AngularJS module, les directives, les filtres et qui peut alors dépendre d'autres modules.

Nous n'avons pas venir avec terriblement utile beaucoup conventions de nommage pour les fichiers source jusqu'à présent bien :). Nous trouvons l'écriture d'un fichier par le contrôleur semble la plus simple; mais d'autres que la fooPlugin.fichier ts et les assistants.fichier ts (pour module spécifique des fonctions d'assistance), nous n'avons pas encore trouvé toutes les autres conventions de nommage jusqu'à présent.

Avertissement: Shameless plug.

Vous devriez certainement vérifier générateur-angulaire-xl.

Elle vise surtout à créer à grande échelle AngularJS applications par le code de regroupement logiquement, les échafaudages de tests unitaires, et injecter automatiquement vos fichiers js et css dans index.html etc. Il aide également par la création d'une maquette de back-end pour vos données, rendant de ce fait un bon choix lors de l'élaboration de prototypes, ce qui peut aussi vivre en plein soufflé applications. Il ne génère PAS de code du back-end, vous êtes donc libre de choisir quelle back-end de la technologie que vous voulez.