https://github.com/chrisbateman/webpack-visualizer
Visualize your Webpack bundle
https://github.com/chrisbateman/webpack-visualizer
webpack webpack-plugin
Last synced: 7 months ago
JSON representation
Visualize your Webpack bundle
- Host: GitHub
- URL: https://github.com/chrisbateman/webpack-visualizer
- Owner: chrisbateman
- License: mit
- Created: 2015-10-03T22:41:09.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2023-10-11T20:29:28.000Z (about 2 years ago)
- Last Synced: 2025-04-11T04:59:24.267Z (8 months ago)
- Topics: webpack, webpack-plugin
- Language: JavaScript
- Homepage: http://chrisbateman.github.io/webpack-visualizer/
- Size: 1.1 MB
- Stars: 1,694
- Watchers: 17
- Forks: 94
- Open Issues: 49
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesomelist - **webpack-visualizer**
- awesome-starred - chrisbateman/webpack-visualizer - Visualize your Webpack bundle (webpack)
- awesome-star-libs - chrisbateman / webpack-visualizer
README
# Webpack Visualizer
Visualize and analyze your Webpack bundle to see which modules are taking up space and which might be duplicates.
This tool is still pretty new, so please submit issues or feature requests!
## Site Usage
Upload your stats JSON file to the site: [chrisbateman.github.io/webpack-visualizer/](http://chrisbateman.github.io/webpack-visualizer/)
## Plugin Usage
```
npm install webpack-visualizer-plugin
```
```javascript
var Visualizer = require('webpack-visualizer-plugin');
//...
plugins: [new Visualizer()],
//...
```
This will output a file named `stats.html` in your output directory. You can modify the name/location by passing a `filename` parameter into the constructor.
```javascript
var Visualizer = require('webpack-visualizer-plugin');
//...
plugins: [new Visualizer({
filename: './statistics.html'
})],
//...
```
---
