Comment utiliser les fichiers es6 compilés par gulp dans des projets réels ?

Question

Je suis un débutant. J'ai vu beaucoup d'environnements de compilation es6 de master construits avec gulp, et je l'ai essayé moi-même, mais je ne comprends toujours pas très bien comment l'utiliser dans des projets réels. J'ai vu des exemples écrits par des maîtres qui combinent plusieurs fichiers es6. Les fichiers js compilés sont finalement fusionnés dans un fichier bundle.js, et bundle.js est également référencé dans la page.
Mon projet actuel comporte plusieurs pages. Par exemple, a.html doit faire référence à a.js et jquery.js, b.html doit faire référence à b.js et jquery.js, et c.html doit faire référence à b.js et c.js et jquery.js. Comment compiler le fichier dans ce cas, et comment l'utiliser en html ?

Answer 1

La première situation que vous avez mentionnée est que vous avez écrit vous-même la tâche gulp pour fusionner plusieurs fichiers en un seul fichier bundle.js. gulp任务，将多个文件最终合并成为一个bundle.js文件。

同样的，对于第二个你说的场景，你只需要写多个gulp任务，最终分别不同的入口文件打包不同的a.js，b.js等等。

在html文件中对应引入即可，gulp作为build

De même, pour le deuxième scénario que vous avez mentionné, il vous suffit d'écrire plusieurs tâches gulp, et enfin de regrouper différents a.js dans différents fichiers d'entrée, b. js et ainsi de suite. 🎜 🎜Introduisez-le simplement dans le fichier html. gulp peut être utilisé dans n'importe quel environnement comme outil de build. Après tout, l'environnement de production n'utilise que. pour générer C'est juste un fichier. 🎜

Answer 2

La tâche personnalisée de

gulp peut compresser et fusionner les fichiers js, il suffit de déclarer le chemin du fichier. bundle.js doit être généré par webpack, qui est optimisé pour la compatibilité ES6 et les navigateurs. En html, vous pouvez directement citer les js compressés et fusionnés dans index.htmlgulp的自定义任务可以压缩和合并js文件，只需要申明文件路径即可。bundle.js应该是webpack生成的，webpack针对ES6和浏览器具有兼容性优化。在html中可以直接在index.html里引用压缩合并后的js即可

在gulp的watch事件中添加针对js文件的监听，这样即可在有任何监听的js文件被修改后重新压缩合并所有js

Ajoutez un moniteur pour le fichier js dans l'événement watch de gulp, afin que tout js surveillé après le le fichier est modifié, recompressez et fusionnez tous les fichiers js pour la mise à jour🎜