Je souhaite regrouper les ressources communes à toutes les pages du projet, telles que reset.css, jq-ui.css, jq.js, etc., dans un seul js. Cela pourra être appelé js d'initialisation à l'avenir, les nouvelles pages ne peuvent y faire référence qu'à ce js.
index.html
<head>
<link href = "css/reset.css"> //所有页面通用
<link href = "css/jq-ui.css"> //所有页面通用
<link href = "css/index.css"> //单独这个页面的css
<head>
<body>
//页面代码……
//页面代码……
</body>
<srcipt src="js/jq.js"></script> //所有页面通用
<srcipt src="js/index.js"></script> //单独这个页面的js<head>
<link href = "css/index.css"> //只保留单独这个页面的css
<head>
<body>
//页面代码……
//页面代码……
</body>
<srcipt src="js/init.js"></script> //想要封装好通用init的js，以后可以通用
<srcipt src="js/index.js"></script> //只保留单独这个页面的js（function(){
var reset_css = document.createElement('link'),
jq_js = document.createElement('script');
//加载通用的css
reset_css.href = "css/reset.css";
//加载通用的js
jq_js.src = "js/jq.js";
}()）Problème d'ordre de chargement des ressources de page
Le reset.css doit être chargé au début. ----La situation réelle est qu'il est chargé après le rendu du DOM, ce qui est inutile
jq.js, car le js de toutes les pages dépend de jq, jq doit être chargé en premier, puis le js de la page est chargé. ----La situation réelle est que la page js est chargée en premier et qu'une erreur est signalée.
Si vous souhaitez obtenir les résultats souhaités ci-dessus, comment devez-vous l'écrire pour vous assurer que les ressources externes src et href sont demandées dans l'ordre souhaité ? Cela signifie que les CSS et js dépendants doivent être exécutés avant l'exécution du js de la page, puis exécutés après le chargement.
J'ai vérifié les événements d'écoute et de chargement des fichiers, mais il y a beaucoup de choses courantes dans ma page. Comment puis-je m'assurer que toutes les ressources initialisées sont chargées avant le chargement ?
common_file1.onload = function(){
common_file2.onload = function(){
common_file3.onload = function(){
return
}
return
}
//再去加载每个页面中的单独需要资源吗？ 这样写感觉好傻 /(ㄒoㄒ)/~~
}
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Je ne sais pas si vous utilisez gulp ou webpack pour l'emballage. Vous pouvez essayer d'introduire un plug-in comme gulp-order
.Je me souviens probablement de les avoir emballés dans l'ordre. Très bien.