Skip to content

chore(build): 优化 vsix 打包#534

Closed
inaku-Gyan wants to merge 3 commits intogithub0null:devfrom
inaku-Gyan:fix/bundle
Closed

chore(build): 优化 vsix 打包#534
inaku-Gyan wants to merge 3 commits intogithub0null:devfrom
inaku-Gyan:fix/bundle

Conversation

@inaku-Gyan
Copy link
Copy Markdown

执行 vsce package 时报警告:

This extension consists of 4167 files, out of which 3411 are JavaScript files. For performance reasons, you should bundle your extension.

两条 webpack 弃用警告:

DEP_WEBPACK_DEPRECATION_ARRAY_TO_SET: Compilation.modules was changed from Array to Set
DEP_WEBPACK_MODULE_ERRORS: Module.errors was removed (use getErrors instead)

问题

  1. 依赖被双份打包:webpack 已经把绝大多数依赖编译进了 dist/extension.js,但因为 package.jsondependencies 字段非空,vsce 会再把所有生产依赖的 node_modules 树原样复制进 vsix。
  2. webpack externals 有两处 bug
    • iconv_lite / jsonc_parser 用了下划线 key,与实际 import 字符串 iconv-lite / jsonc-parser 不匹配,规则永远不命中。这两个包仍然被 bundle,但同时又随 dependencies 被多复制了一份。
    • unzipper 出现在 externals 中,但项目根本没有这个依赖(src/ResInstaller.ts 中只是恰巧有同名局部变量),是死规则。
  3. webpack 弃用警告来自 ts-loader@6.2.2--trace-deprecation 显示堆栈指向 ts-loader/dist/after-compile.js。该版本针对 webpack 4 设计,在 webpack 5 下使用了已废弃的 Compilation.modules 数组与 Module.errors API。

改动

1. webpack.config.js

  • 配置改写为函数形式,按 mode 生成。
  • externals 只保留 vscode,其余依赖由 webpack 内联打包。
  • devtool 按模式切换:production 关闭 source map,development 仍生成。
  • 移除拼写错误的 iconv_lite / jsonc_parser 与死规则 unzipper

2. package.json

  • 全部 14 项 dependencies 移入 devDependencies(这些纯 JS 包均已被 webpack bundle,运行时无需在 node_modules 中独立存在)。dependencies 留空,使 vsce 默认行为也不会再复制 node_modules
  • ts-loader: ^6.2.1^9.5.1。ts-loader 9.x 原生支持 webpack 5。

3. .vscodeignore

  • .git 改为 **/.git:原规则只匹配根目录。lib/node-utility/.git 被包进 vsix。
  • 增加 node_modules
改前 改后
vsix 文件总数 4066 385
vsix 体积 28.11 MB 23.5 MB
DEP_WEBPACK 警告 2 条 0
vsce 打包警告 1 条 0

兼容性

  • 所有原 dependencies 都是纯 JS(无 native module),bundle 后行为一致。
  • ts-loader 9.x 与现有 TypeScript 3.9、tsconfig.json 配置兼容。

@inaku-Gyan
Copy link
Copy Markdown
Author

另外,不知道 offline-pack.vscodeignore 文件是否还有作用?是否可以删除?

@github0null
Copy link
Copy Markdown
Owner

这是一个危险改动。我不知道你是否完全测试过插件的所有功能(不是在插件调试模式,而是通过vsix安装的全新安装状态)

我知道这个项目使用的包和工具很多都过时了,因为这个项目始于19年。我的原则是 如果它现在能正常工作,那么我不会动它,除非已经到了不改不能用的地步。

为什么有些包是分离的没有打成一个 bundle.js,这是刻意为之,有些包含有浏览器的兼容部分,使用 webpack 打包会引入一些 nodejs 中没有的东西,这会导致错误,而另一些则是其他原因。 当然我没有深究这些问题到底是我的做法有问题,还是包本身的问题,因为问题已经得到解决。

另外,我不知道你是否使用了 AI,该提交完全移除了 dependencies,然而有些包是开发工具有些则是项目依赖,这显然是不对的。

我倾向于拒绝该提交,这个插件有多个平台的支持,这个修改会导致大量的测试,这个项目没有测试用例因此所有的测试需要手动完成。为5MB的尺寸优化和一些Warnings消除不值得。

@inaku-Gyan
Copy link
Copy Markdown
Author

感谢你的解释。确实应当以兼容性为重,而本项目实在难以测试。我支持你的决定,我会关闭这个 PR。

补充说明一下:
之前移除 dependencies 是因为 vsce 好像会自动打包 dependencies 里的包,但实际上它们已经被 webpack 打包过了,所以二者就重复了。我当时打包成 vsix 在 Win11 上安装测试了一下,看起来没有大问题(但确实没有做完善的测试)。
不过把所有 deps 改为 devDeps 确实语义上不正确。我重新查了一下,应该改用 vsce package --no-dependencies 更妥当。

@inaku-Gyan inaku-Gyan closed this May 5, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants