11

如何给类库打包

 2 years ago
source link: https://icodex.me/packlib/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

配置项

rollup支持 CLI 命令rollup,默认查找项目根目录下的rollup.config.js配置文件,默认配置文件使用 CJS 模块语法,但是也支持以.cjs.mjs两种后缀来区分在配置文件中使用的模块语法。

// rollup.config.js
interface Configuration {
// 打包入口
input?: string | string[] | { [entryAlias: string]: string };
// 插件数组
plugins?: (Plugin | null | false | undefined)[];
// 忽略打包的模块
external?: (string | RegExp)[]
| string
| RegExp
| ((
source: string,
importer: string | undefined,
isResolved: boolean
) => boolean | null | undefined);

// 缓存之前的构建产物,在 watch 模式下提高后续构建速度,开启的时候 rollup 会只分析改变的模块
// 可以指定缓存 plugin 和 module
cache?: false | RollupCache;
// 警示信息自定义处理函数
onwarn?: Function;
preserveEntrySignatures?: false | 'strict' | 'allow-extension' | 'exports-only';
// 是否对使用了 rollup 过时的特性直接报错
strictDeprecations?: boolean;

// acorn 编译器的配置项
acorn?: AcornOptions;
// acorn 使用的插件
acornInjectPlugins?: (() => unknown)[] | (() => unknown);
// 全局上下文对象,例如 window
context?: string;
// 单独配置每个模块的上下文对象
moduleContext?: ((id: string) => string | null | undefined) | { [id: string]: string };
preserveSymlinks?: boolean;
// 是否对使用未定义的模块提示报错
shimMissingExports?: boolean;
// 自定义 tree-shaking 的过程
treeshake?: boolean | TreeshakingPreset | TreeshakingOptions;,

// 确定在运行了多少次之后,插件不再使用的缓存资源应该被删除,默认 10
experimentalCacheExpiry?: number,
// 是否计算构建性能,例如构建时间等
perf?: boolean,

// 构建输出配置,可以是一个数组
output: {
// 输出文件目录
dir?: string;
// 输出文件名
file?: string;
// 指定输出产物的模块语法,默认 es,也就是 ES Modules 语法
format?: 'amd' | 'cjs' | 'es' | 'iife' | 'system' | 'umd'| 'commonjs' | 'esm' | 'module' | 'systemjs';
// 将外部模块 ID 转换为全局变量名,例如 jquery => $, 在所有模块内部不需要引用 jquery 就可以直接使用 $
globals: { [name: string]: string } | ((name: string) => string);
// 打包产物对外暴露的全局变量名
name?: string;
// 只作用于当前输出的插件
plugins?: (OutputPlugin | null | false | undefined)[];

// 其他静态资源的输出文件名
assetFileNames?: string | ((chunkInfo: PreRenderedAsset) => string);
// 放置在打包产物顶部的字符串内容,例如作者信息,版本声明等,和下面的 footer 一样
banner?: string | (() => string | Promise<string>);
footer?: string | (() => string | Promise<string>);
// 指定 code-splitting 拆分出来的 chunk 的文件名
chunkFileNames?: string | ((chunkInfo: PreRenderedChunk) => string);
// 减少 rollup 生成的包装器的代码,可以用于优化生成产物体积,默认 false
compact?: boolean;
// 指定从 entry 指定的 chunk 的文件名
entryFileNames?: string | ((chunkInfo: PreRenderedChunk) => string);
// 是否拓展 name 指定的全局变量的名称
extend?: boolean,
// 当拆分多个 chunk 的时候,rollup 会把后续关联的模块添加到入口模块 import 进来,这样JS 引擎在从
// 入口开始加载 chunk 的时候就会提前发现其他关联的模块并加载它们,从而提升多个 chunk 的加载速度
hoistTransitiveImports?: boolean,
// 当指定一个入口模块的时候,将其内部使用动态导入 import() 的模块直接打包进来而不是创建单独的 chunk
inlineDynamicImports?: boolean,
interop?: boolean | 'auto' | 'esModule' | 'default' | 'defaultOnly';
// 放置在打包产物内部的介绍信息
intro?: string | (() => string | Promise<string>);
outro?: string | (() => string | Promise<string>);
// code-splitting 的方式,可以将第三方包拆分出来成单独的 chunk
manualChunks?: { [chunkAlias: string]: string[] } | GetManualChunk;
// 对于 es 模块或者 compact 设置为 true,会将模块名混淆成单个字母来表示,更好的压缩代码体积
minifyInternalExports?: boolean;
// 配置 external 指定的模块名和模块路径的映射关系,可以是 CDN URL 地址
paths?: Record<string, string> | ((id: string) => string);
// 将每个模块都拆分成单独的 chunk 打包输出,可用于将文件结构转换为不同的模块格式来输出不同打包产物
preserveModules?: boolean;
// 保证指定目录的模块从入口进入可以输出到 output 指定的输出文件夹,从而和 preserveModules 隔离开
preserveModulesRoot?: string;
// 输出 sourcemap 的形式,默认 false
sourcemap?: boolean | 'inline' | 'hidden';
// 指定源代码的实际代码是否被添加到 sourcemap 中,可减小 sourcemap 的体积
sourcemapExcludeSources?: boolean;
sourcemapFile?: string;
sourcemapPathTransform,
// 校验生成的 JS 代码是否有效
validate?: boolean;

// 以下属于模块语法相关的配置项
amd;
esModule?: boolean;
// 决定模块导出的语法形式,默认情况下 rollup 会根据入口模块来决定
exports?: 'default' | 'named' | 'none' | 'auto';
// 是否不允许修改导出的模块
externalLiveBindings?: boolean;
// 是否使用 Object.freeze 冻结 import as 形式导出的模块
freeze?: boolean;
// 是否使用缩进字符
indent?: boolean | string;
namespaceToStringTag?: boolean;
// 为 UMD 模块添加额外的不会导致冲突的导出
noConflict?: boolean;
// 使用 const 定义导出的模块而不是 var
preferConst?: boolean;
// 移除 chunk 名称中的 \0, ? and * 字符
sanitizeFileName?: boolean | (string) => string;
// 是否在非 ES Modules 模块顶部添加 use strict,默认添加
strict?: boolean;
// 当打包模块输出为 SystemJS 的时候,是否用 null 替换空的 setter 方法
systemNullSetters?: boolean;
},
// 热更新监听配置
watch: {
// 配置 Rollup 在触发重新构建之前等待进一步更改的时间
buildDelay?: number;
chokidar?: ChokidarOptions;
// 是否在重新构建的时候清空控制台
clearScreen?: boolean;
// 排除监听的文件
exclude?: string | RegExp | (string | RegExp)[];
include?: string | RegExp | (string | RegExp)[];
// 触发热更新的时候是否跳过 bundle.write()
skipWrite?: boolean;
}
};

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK