Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ambar/vscode-bundle-size
Display the bundle size of npm packages: https://marketplace.visualstudio.com/items?itemName=ambar.bundle-size
https://github.com/ambar/vscode-bundle-size
bundle size vscode vscode-extension
Last synced: 3 months ago
JSON representation
Display the bundle size of npm packages: https://marketplace.visualstudio.com/items?itemName=ambar.bundle-size
- Host: GitHub
- URL: https://github.com/ambar/vscode-bundle-size
- Owner: ambar
- Created: 2021-10-25T10:44:19.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-04-04T02:23:55.000Z (10 months ago)
- Last Synced: 2024-05-04T23:41:43.944Z (9 months ago)
- Topics: bundle, size, vscode, vscode-extension
- Language: TypeScript
- Homepage:
- Size: 848 KB
- Stars: 28
- Watchers: 1
- Forks: 1
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# bundle-size
Display the bundle size of npm packages.
## Features
- Lightning fast, instantly show bundle result, powered by [esbuild](https://github.com/evanw/esbuild)
- Support JSX/Typescript/CSS
- For namespace (`* as`) imports, only count in-use properties
- Bundle in memory and locally, no file writing, no extra installation
- Provide hover card of bundle statistics
Preview basic usage:
Preview namespace imports:
Preview hover card:
## Requirements
Because this extension builds locally, you need to pre-install dependencies.
## Extension Settings
```jsonc
{
"bundleSize.cache": {
"type": "boolean",
"default": true,
"description": "Whether to cache the bundle result (it's highly recommended to turn on, unless you are debugging or want to edit files in dependencies)"
},
"bundleSize.cautionSize": {
"type": "number",
"default": 50,
"description": "Size limit in KB, display caution color if exceeded"
},
"bundleSize.dangerSize": {
"type": "number",
"default": 100,
"description": "Size limit in KB, display danger color if exceeded"
},
"bundleSize.infoColor": {
"type": "string",
"default": "#090",
"description": "Info (default) color for the size text"
},
"bundleSize.cautionColor": {
"type": "string",
"default": "#ea0",
"description": "Caution color for the size text"
},
"bundleSize.dangerColor": {
"type": "string",
"default": "#e33",
"description": "Danger color for the size text"
},
"bundleSize.loader": {
"type": "object",
"patternProperties": {
".*": {
"type": "string",
"enum": [
"base64",
"binary",
"copy",
"css",
"dataurl",
"default",
"empty",
"file",
"js",
"json",
"jsx",
"local-css",
"text",
"ts",
"tsx"
]
}
},
"default": {},
"markdownDescription": "Override the loader in Bundle Size (eg: `.js: jsx` will force `.js` files to be treated as JSX), see [esbuild#loader](https://esbuild.github.io/api/#loader) for more details"
},
"bundleSize.flowPattern": {
"type": "string",
"default": "\\/node_modules\\/(@react-native|react-native|react-native-linear-gradient)\\/(.*)\\.js$",
"description": "The regexp pattern to match files containing the Flow type"
}
}
```
## Known Issues
- Only import declaration is supported (no plan for `require()` statement)