是否可以将模块捆绑到单个缩小的.js以包含在单个标签中?我知道服务器端js包是一个不同的故事,但在我的情况下,它实际上是由浏览器加载的,我不想有多个http请求。下面是一个过度简化的示例,子树/命名空间不一定相关,但最终在单个对象中分组在一起:// fruits/base.js export default class Fruit_base {};// fruits/apple.js import Fruit_base from "./base.js"; export default class Apple extends Fruit_base {};// fruits/orange.js import Fruit_base from "./base.js"; export default class Orange extends Fruit_base {};// fruits/allOfThem.js import Fruit_base from "./base.js"; import Apple from "./apple.js"; import Orange from "./orange.js"; const Fruits = {Fruit_base, Apple, Orange}; export default Fruits;// animals/base.js export default class Animal_base {};// animals/cat.js import Animal_base from "./base.js"; export default class Cat extends Animal_base {};// animals/dog.js import Animal_base from "./base.js"; export default class Dog extends Animal_base {};// animals/allOfThem.js import Animal_base from "./base.js"; import Cat from "./cat.js"; import Dog from "./dog.js"; const Animals = {Animal_base, Cat, Dog}; export default Animals;// main.js import Fruits from "./fruits/allOfThem.js"; import Animals from "./animals/allOfThem.js"; const someVar = 1; const someOtherVar = 2; function someFunc() {} const Things = {Fruits, Animals, someVar, someOtherVar, someFunc}; export default Things;然后能够执行以下操作:<html> <body> <script type="module"> import Things from "/assets/js/things.min.js"; const apple = new Things.Fruits.Apple(); const dog = new Things.Animals.Dog(); Things.someFunc(); </script> </body></html>让我感到困惑的是,在导入/导出模块时,我们可以使用别名,所以我不确定任何工具如何找出工作所需的适当名称。另外,如果是服务器端的js,从我读到的内容来看,我知道一些捆绑器会为了只部署最小值而进行树摇动,但在我的情况下,所有内容都必须包括在内,因为我们不知道浏览器会用它做什么(例如,在控制台中使用它)
添加回答
举报
0/150
提交
取消