# webpack-bundle-tracker-async

> Spits out some stats about webpack compilation process to a file

Latest version **0.5.2-beta** (published 2019-09-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install webpack-bundle-tracker-async
pnpm add webpack-bundle-tracker-async
yarn add webpack-bundle-tracker-async
bun add webpack-bundle-tracker-async
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.5.2-beta |
| Published | 2019-09-03 |
| First published | 2019-09-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 12.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Owais Lone |
| Maintainers | katonada |
| Keywords | webpack, bundle, stats, files |

## Links

- npm: https://www.npmjs.com/package/webpack-bundle-tracker-async
- Repository: https://github.com/katonada/webpack-bundle-tracker
- Homepage: https://github.com/katonada/webpack-bundle-tracker#readme
- Issues: https://github.com/owais/webpack-bundle-tracker/issues
- npm.io page: https://npm.io/package/webpack-bundle-tracker-async

## Dependencies (3)

- [mkdirp](https://npm.io/package/mkdirp.md) ^0.5.1
- [strip-ansi](https://npm.io/package/strip-ansi.md) ^2.0.1
- [deep-extend](https://npm.io/package/deep-extend.md) ^0.6.0

## Alternatives

- [unionfs](https://npm.io/package/unionfs.md) — 2.2M weekly downloads
- [path-starts-with](https://npm.io/package/path-starts-with.md) — 35.9K weekly downloads
- [redzip](https://npm.io/package/redzip.md) — 1.2K weekly downloads
- [vscode-anymatch](https://npm.io/package/vscode-anymatch.md) — 848 weekly downloads
- [@ledgerhq/coin-filecoin](https://npm.io/package/@ledgerhq/coin-filecoin.md) — 793 weekly downloads

## Recent versions

- 0.5.2-beta (latest) — 2019-09-03
- 0.5.1-beta — 2019-09-03
- 0.5.0-beta — 2019-09-03

## README

# webpack-bundle-tracker

Spits out some stats about webpack compilation process to a file.

This is the fork of `webpack-bundle-tracker` (https://github.com/owais/webpack-bundle-tracker) with added functionality for async chunks.

There are two types of chunks, named e.g: `main`, `app`, `vendors` and with `id` - service chunks

Named chunks needs to be preload an service chunks needs to be prefeched.

I use this plugin in combination with `django-webpack-loader` (https://github.com/owais/django-webpack-loader)

<br>

## Install

```bash
npm install --save-dev webpack-bundle-tracker-async
```

<br>

## Usage

```javascript
var BundleTracker  = require('webpack-bundle-tracker');
module.exports = {
    context: __dirname,
    entry: {
      app: ['./app']
    },

    output: {
        path: require("path").resolve('./assets/bundles/'),
        filename: "[name]-[hash].js",
        publicPath: 'http://localhost:3000/assets/bundles/',
    },

    plugins: [
      new BundleTracker({
        path: __dirname,
        filename: './assets/webpack-stats.json',
        preload: 'async_preload', // for preloading named chunks
        prefetch: 'async_prefetch', // for prefetching service chunks
      })
    ]
}
```

`./assets/webpack-stats.json` will look like,

```json
{
  "status": "done",
  "chunks": {
    "app": [
      {
        "name": "app-0828904584990b611fb8.js",
        "publicPath": "http://localhost:3000/assets/bundles/app-0828904584990b611fb8.js",
        "path": "/home/user/project-root/assets/bundles/app-0828904584990b611fb8.js"
      }
    ],
    "runtime": [
      {
        "name": "runtime-58e2b6c82f0f9e50524c.js",
        "publicPath": "http://localhost:3000/assets/bundles/runtime-58e2b6c82f0f9e50524c.js",
        "path": "/home/user/project-root/assets/bundles/runtime-58e2b6c82f0f9e50524c.js"
      }
    ]
  },
  "entryPoints": {
    "main": [
      [
        {
        "name": "app-0828904584990b611fb8.js",
        "publicPath": "http://localhost:3000/assets/bundles/app-0828904584990b611fb8.js",
        "path": "/home/user/project-root/assets/bundles/app-0828904584990b611fb8.js"
        }
      ],
      [
        {
        "name": "runtime-58e2b6c82f0f9e50524c.js",
        "publicPath": "http://localhost:3000/assets/bundles/runtime-58e2b6c82f0f9e50524c.js",
        "path": "/home/user/project-root/assets/bundles/runtime-58e2b6c82f0f9e50524c.js"
        }
      ]
    ]
  }
}
```

In case webpack is still compiling, it'll look like,


```json
{
  "status":"compiling",
}
```



And errors will look like,
```json
{
  "status": "error",
  "file": "/path/to/file/that/caused/the/error",
  "error": "ErrorName",
  "message": "ErrorMessage"
}
```

`ErrorMessage` shows the line and column that caused the error.



And in case `logTime` option is set to `true`, the output will look like,
```
{
  "status":"done",
  "chunks":{
   "app":[{
      "name":"app-0828904584990b611fb8.js",
      "publicPath":"http://localhost:3000/assets/bundles/app-0828904584990b611fb8.js",
      "path":"/home/user/project-root/assets/bundles/app-0828904584990b611fb8.js"
    }]
  },
  "startTime":1440535322138,
  "endTime":1440535326804
}
```

By default, the output JSON will not be indented. To increase readability, you can use the `indent`
option to make the output legible. By default it is off. The value that is set here will be directly
passed to the `space` parameter in `JSON.stringify`. More information can be found here:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

<br>

## Bundle Tracker Options

* `filename` - Name of the bundle tracker JSON file.
* `logTime` - Optional boolean property to output `startTime` and `endTime` in bundle tracker file.
* `path` - Optional bundle tracker output path.
* `publicPath` - Optional property to override `output.publicPath`.
* `preload` - name of key for chunks to preload (named chunks)
* `prefetch` - name of key for chunks to prefetch (service chunks)

---
_Source: https://npm.io/package/webpack-bundle-tracker-async · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._