I am new with InversifyJs. It looks great and I am trying to implement it into my project. On the official website (http://inversify.io/) I read that it is a 4k library and this is fine because I have to keep the size of the bundle as smaller as possible. Unfortunately After implementing it the overall size(minified and compressed) of the bundle increased about 20k. This unexpected result is not great and I have to remove inversifyjs if I don't find a solution. I was wondering that maybe something is wrong in my configuration.
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) I have only added these two properties to the previous tsconfig: "lib": ["es6", "dom"] "types": ["reflect-metadata"]
2) I have added import "reflect-metadata" at the entry-point of my app. This library alone increases the bundle about 4k.
3) I created a container and changed an existing class to be injected. When I import the container to my app entry-point, InversifyJs becomes part of my webpack-bundle, increasing it about additional 15k. The expected result was to increase the bundle no more than 4k + the size of the new few lines of code I have added to implement the container.
NOTE: InversifyJs works fine for me. The only issue/concern I have is about the size of the library that is much higher than how it is presented on the official website.