RequireJS: Multiple main.js?

Je construisais une application à une seule page en utilisant requireJS et jusqu'à présent l'aimer. Je suis venu au point de développer d'autres parties du site en dehors de l'application principale et je ne suis pas vraiment sûr de savoir comment (ou si) utiliser le requireJS pour cela.

Dans mon application principale, tout est déclenché par cette balise de script:

<script data-main='/scripts/main' src='/scripts/libs/require.js'> 

Je développe maintenant la page d'accueil qui possède ses propres scripts avant. En utilisant l'optimiseur en ce qui concerne la mise en ligne du site, qui regroupera tous ces scripts dans un package principal.js. Je suis en difficulté pour comprendre où le reste de mon site s'inscrit dans cette situation.

Dites que mon application dépend de jQuery et qu'elle est intégrée dans la version optimisée de l'application, et si je souhaite utiliser jQuery sur la page d'accueil? Je ne veux pas charger dans main.js mon application juste pour accéder à mon module jQuery. Alors oui … un peu confus!

J'imagine une structure de site comme celle-ci:

 /scripts - app-main.js //(includes all module dependencies after optimzation) - home-main.js //(includes all module dependencies after optimzation) 

App:

 <script data-main='/scripts/app-main' src='/scripts/libs/require.js'> 

Page d'accueil:

 <script data-main='/scripts/home-main' src='/scripts/libs/require.js'> 

Des questions

  1. Comment puis-je utiliser RequireJS pour développer différentes parties d'un site?
  2. Est-il recommandé d'avoir plusieurs fichiers main.js?
  3. Comment mes différents fichiers main.js peuvent- main.js partager des modules communs tels que jQuery post optimization?

Donc require.js devrait toujours être utilisé sur n'importe quelle page pour permettre la modularité et un espace de noms propre. Je crois que chaque «application» a besoin de son propre script main.js. Lorsque l'optimisation de votre site r.js vous permet d'exclure les modules de la compilation que vous devez faire pour jQuery toujours.

De cette façon, require.js va toujours charger jquery.js à la volée et la plupart du temps à partir du cache. Trouver d'autres modules qui pourraient être mis en cache entre votre application et la page d'accueil doit être fait à votre propre discrétion et dépend du flux de vos utilisateurs et d'autres facteurs.

Il semble que vous avez deux projets, une application et un site de marketing. Je crois que ceux-ci devraient être séparés dans une large mesure et devraient avoir leurs propres dossiers 'js' contenant leur propre main.js.

L'équipe requirejs a quelques échantillons pour les applications multipage sur github. Regardez: https://github.com/requirejs/example-multipage

Fondamentalement, vous aurez la structure suivante:

  • Page1.html: page 1 de l'application.

  • Page2.html: page 2 de l'application.

  • Js app: le répertoire pour stocker des modules spécifiques à l'application.

  • Lib: le répertoire pour contenir des modules tiers, comme jQuery.

  • Common.js: contient la configuration requirejs, et ce sera la cible de construction pour l'ensemble des modules communs.

  • Page1.js: utilisé pour la base de données pour page1.html. Charge le module commun, puis charge l'application / main1, le module principal pour la page 1.

  • Page2.js: utilisé pour la base de données pour page2.html. Charge le module commun, puis charge app / main2, le module principal pour la page 2.