Question

我是InversifyJs的新手。它看起来很棒，我正在尝试将它实现到我的项目中。在官方网站（http://inversify.io/）上我读到它是一个4k库，这很好，因为我必须尽可能地缩小捆绑的大小。不幸的是，在实施之后，捆绑的整体尺寸（缩小和压缩）增加了大约20k。这个意想不到的结果并不是很好，如果我找不到解决方案，我必须删除inversifyjs。我想知道我的配置可能有问题。

tsconfig：

{
"compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "outDir": "./Content/dist",
    "target": "es5",
    "lib": ["es6", "dom"],
    "types": ["reflect-metadata"],
    "module": "commonjs",
    "noImplicitAny": false,
    "removeComments": true,
    "preserveConstEnums": true,
    "sourceMap": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "allowJs": true,
    "jsx": "react"
},
"typeRoots": [
  "./node_modules/@types/"
],
"exclude": [
    "node_modules"
]

}

1）我只将这两个属性添加到以前的tsconfig： ＆＃34; lib＆＃34;：[＆＃34; es6＆＃34;，＆＃34; dom＆＃34;] ＆＃34;类型＆＃34;：[＆＃34;反映元数据＆＃34;]

2）我在应用的入口点添加了导入＆＃34; reflect-metadata＆＃34; 。仅此库可将捆绑量增加约4k。

3）我创建了一个容器并更改了要注入的现有类。当我将容器导入我的app入口点时，InversifyJs成为我的webpack-bundle的一部分，增加了大约15k。预期的结果是增加捆绑不超过4k +我为实现容器添加的新几行代码的大小。

注意：InversifyJs对我来说很好。我唯一关心的问题是图书馆的大小远远高于在官方网站上展示的大小。

Answer 1

反转网站暂时没有更新。它在版本1.0中是4k，但是打字稿和反转都发展了很多。此外，计算4k时不包括反射元数据的大小。

TypeScript现在生成一些更大的polyfill，也许您应该考虑使用https://github.com/Microsoft/tslib并确保webpack正在进行树木摇晃http://blog.rangle.io/optimize-your-angular2-application-with-tree-shaking/

使用webpack InversifyJS，库大小远远超过4k

1 个答案: