Rollup 打包一个 JavaScript 项目

export default {input: "./src/FFCesium/core/index.js", // 输入文件output: {file: "public/lastVersion/FFCesium.confuse.js", // 输出文件//format: "cjs", // 打包格式为cjsformat: "es",exports: "default", // 或者 'default'},external: ["cesium", "cesium-navigation-es6", "@turf/turf", "vue"],plugins: [Obfuscator(),nodeResolve(), // 解析npm模块commonjs(), // 将CommonJS模块转为可被Rollup处理的格式image(), //支持打包图片postcss({extract: false, // 提取到单独的 CSS 文件minimize: true, // 压缩 CSS}), //支持打包css],
};
  1. input: 指定打包的入口文件路径,这里是 ./src/FFCesium/core/index.js,即项目的主入口文件。

  2. output: 指定打包后输出的文件配置。

    • file: 输出文件的路径为 public/lastVersion/FFCesium.confuse.js
    • format: 输出的模块格式为 ES Module ("es"),这种格式适用于现代 JavaScript 模块系统,支持树摇和异步加载。
    • exports: 指定输出的方式为 default,表示默认导出方式。这对于 ES Module 格式来说是默认的导出方式。
  3. external: 声明外部依赖,这些依赖不会被打包进最终的输出文件中,而是在运行时从外部引入。在这个配置中,外部依赖包括 cesium, cesium-navigation-es6, @turf/turf, 和 vue

  4. plugins: 插件列表,用于处理不同类型的文件和资源。

    • Obfuscator(): 这个插件可能是自定义的,用于混淆代码,增强代码的安全性。
    • nodeResolve(): 解析 Node.js 模块,使得 Rollup 能够处理引入的 npm 包。
    • commonjs(): 将 CommonJS 模块转换为 ES Module 格式,以便 Rollup 可以处理它们。
    • image(): 支持打包图片资源,可能是自定义的处理图片的插件。
    • postcss(): 处理 CSS 文件的插件,这里设置了不提取到单独的 CSS 文件,而是内联到 JavaScript 文件中,并启用了 CSS 的压缩功能。

这个配置文件的目的是将项目中的 JavaScript 和相关资源打包成一个单独的 JavaScript 文件,以 ES Module 的格式输出到 public/lastVersion/FFCesium.confuse.js 文件中。配置中使用了一些常见的插件来处理 JavaScript 模块、图片和 CSS 等资源,确保打包后的文件能够在浏览器或 Node.js 环境中运行和加载。

需要的资源

import { nodeResolve } from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import image from "@rollup/plugin-image";
import postcss from "rollup-plugin-postcss";
import Obfuscator from "rollup-plugin-obfuscator";

在package.json中配置

"scripts": {"dev": "vite ","build": "vite build","preview": "vite preview","pack": "rollup --config bin/pack/rollup.config.js","packmin": "rollup --config bin/pack/rollup.config.min.js","packconfuse": "rollup --config bin/pack/rollup.config.confuse.js","packconfusemin": "rollup --config bin/pack/rollup.config.confuse.js && rollup --config bin/pack/rollup.config.confuse.min.js"},

rollup ---config +路径。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/27191.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

电脑超频是否能把平平无奇的CPU性能提升到超高性能的CPU水平?

前言 这一期着实很有意思哈,一颗平平无奇的CPU通过超频,把性能提升到超高性能的CPU水平。 举个例子:类似于把i7-4790k这颗十年前的高性能CPU超频到性能与i9-14900同样水准,是否可行? 先科普一下:i7-4790…

中文版svn怎么忽略文件

个人需求: 不上传dist,dist.7z,node_modules等文件夹 实际操作: 前言:在上传svn为避免操作失败导致丢失文件的情况,保险起见,先备份代码 1:右键点击 2:点击新建 – 其…

分布式光纤测温DTS与红外热成像系统的主要区别是什么?

分布式光纤测温DTS和红外热成像系统在应用领域和工作原理上存在显著的区别,两者具有明显的差异性。红外热成像系统适用于表现扩散式发热、面式场景以及环境条件较好的情况下。它主要用于检测物体表面的温度,并且受到镜头遮挡或灰尘等因素的影响会导致失效…

【Shopee】计算虾皮订单的各项支出和订单收入计算方法

虾皮订单成交截图 基础条件: 商品金额:11.92 [4x2.98] 商品原价:7.5 商品折后价:2.98 商品数量:4 优惠券与回扣: 店铺优惠券(减10%):1.2 [11.92x10% 四舍五入了] 订单实…

微软bing英文地图公司地址标注

实现效果如下&#xff1a; 通过微软Bing地图嵌入代码&#xff0c;以在网站中展示公司地址&#xff0c;使用鼠标滚动可缩放或点击拖动地图。 直接上代码&#xff0c;根据自己的需求修改相关信息即可。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN…

消息群发工具制作的过程和需要用到的源代码!

在信息化快速发展的今天&#xff0c;消息群发工具因其高效、便捷的特点&#xff0c;在各个领域得到了广泛的应用&#xff0c;无论是企业营销、社交互动&#xff0c;还是日常通知&#xff0c;消息群发工具都发挥着不可替代的作用。 本文将详细介绍消息群发工具的制作过程&#…

opencv_核心操作

图像基本操作 访问和修改像素值 import numpy as np import cv2 img cv2.imread(c:/Users/HP/Downloads/basketball.png) h,w,c img.shape #图像大小 print(h,w,c)### 841 1494 3# 通过行和列坐标访问像素值 img[100,100]### 231 ### array([231, 140, 146], dtypeuint8)# …

额定值高于 1 kW 的电机驱动应用使用 GaN 逆变器 IC

GaN 技术的三个重要的参数是更高的带隙、临界场和电子迁移率。当这些参数结合起来时&#xff0c;由于 GaN 晶体的临界场高 10 倍&#xff0c;因此与硅 MOSFET 相比&#xff0c;电端子之间的距离可以近 10 倍。这导致了 GaN 和硅之间的明显区别&#xff1a;中压 GaN 器件可以基于…

AI大模型探索之路-实战篇:智能化IT领域搜索引擎之知乎网站数据获取(初步实践)

系列篇章&#x1f4a5; No.文章1AI大模型探索之路-实战篇&#xff1a;智能化IT领域搜索引擎的构建与初步实践2AI大模型探索之路-实战篇&#xff1a;智能化IT领域搜索引擎之GLM-4大模型技术的实践探索3AI大模型探索之路-实战篇&#xff1a;智能化IT领域搜索引擎之知乎网站数据获…

list容器的基本使用

目录 前言一&#xff0c;list的介绍二&#xff0c;list的基本使用2.1 list的构造2.2 list迭代器的使用2.3 list的头插&#xff0c;头删&#xff0c;尾插和尾删2.4 list的插入和删除2.5 list 的 resize/swap/clear 前言 list中的接口比较多&#xff0c;与string和vector类似&am…

【数据库设计】宠物商店管理系统

目录 &#x1f30a;1 问题的提出 &#x1f30a;2 需求分析 &#x1f30d;2.1 系统目的 &#x1f30d;2.2 用户需求 &#x1f33b;2.2.1 我国宠物行业作为新兴市场&#xff0c;潜力巨大 &#x1f33b;2.2.2 我国宠物产品消费规模逐年增大 &#x1f33b;2.2.3 我国宠物主选…

GPT办公与科研应用、论文撰写、数据分析、机器学习、深度学习及AI绘图高级应用

原文链接&#xff1a;GPT办公与科研应用、论文撰写、数据分析、机器学习、深度学习及AI绘图高级应用https://mp.weixin.qq.com/s?__bizMzUzNTczMDMxMg&mid2247606667&idx3&sn2c5be84dfcd62d748f77b10a731d809d&chksmfa82606ccdf5e97ad1a2a86662c75794033d8e2e…

数据结构-树的性质

树的定义 树是一个有限数据元素的集合&#xff0c;当数据的量为0时&#xff0c;称为空树。 在一个非空树T中&#xff0c;最上方的结点没有前驱结点&#xff0c;称为根节点。在一个数据量大于1的树中&#xff0c;除了根节点之外的其余数据元素可以被分为m个互不相交的集合T1,T2,…

[leetcode]删除链表中倒数第k个结点

. - 力扣&#xff08;LeetCode&#xff09; class Solution { public:ListNode* trainningPlan(ListNode* head, int cnt) {int n 0;ListNode* node nullptr;for (node head; node; node node->next) {n;}for (node head; n > cnt; n--) {node node->next;}retu…

场外期权如何开户?开户有哪些流程?

今天带你了解场外期权如何开户&#xff1f;开户有哪些流程&#xff1f;场外期权是一种金融衍生品&#xff0c;其开户流程和条件对于投资者来说至关重要。 场外期权如何开户&#xff1f; 需要满足532资质&#xff0c;参与者需为法人、合伙企业或其他组织&#xff0c;最近一年末…

《吸血鬼猎人D》观后感

前言 在B站无意中发现了一部动漫电影《吸血鬼猎人D》&#xff0c;看着封面还不错&#xff0c;就试着点开了视频&#xff0c;看了一会儿&#xff0c;发现画面很精美&#xff0c;人物造型高大威猛&#xff0c;肌肉线条清晰可见。如果我没记错的话&#xff0c;这种风格在日本动漫中…

填报志愿选大学专业,文科生如何选专业?

读文科的同学接触的专业知识相对广泛&#xff0c;往往被认为是“万金油”&#xff0c;他们仿佛什么都能做&#xff0c;但是和专业技能类知识不同&#xff0c;缺乏技术支持&#xff0c;从而使得文科专业的就业方向和前景远远比不上理科专业那么明朗&#xff0c;对于众多文科生而…

U-Mail反垃圾邮件网关助力企业抵御垃圾邮件,守护邮箱安全

在数字化时代&#xff0c;电子邮件已成为企业沟通不可或缺的工具&#xff0c;它在促进信息流通和提高工作效率方面扮演着关键角色。然而&#xff0c;随着电子邮件使用的普及&#xff0c;垃圾邮件问题也日益凸显&#xff0c;特别是那些携带恶意软件或钓鱼链接的邮件&#xff0c;…

深度学习(六)——神经网络的基本骨架:nn.Module的使用

一、torch.nn简介 官网地址&#xff1a; torch.nn — PyTorch 2.0 documentation 1. torch.nn中的函数简介 Containers&#xff1a;神经网络的骨架 Convolution Layers&#xff1a;卷积层 Pooling layers&#xff1a;池化层 Padding Layers&#xff1a;Padding Non-linear …

企业数据中台功能介绍

参考视频&#xff1a; 企业级数据中台功能演示_哔哩哔哩_bilibili 具体项目&#xff1a; 平台基础设施: 系统管理,系统监控&#xff08;登录/操作日志&#xff09;,任务调度 元数据管理: 业务系统管理/数据源管理/数据表管理/字段管理 数据源,元数据,数据授权,变更记…