{"id":16429700,"url":"https://github.com/dominique-mueller/simple-progress-webpack-plugin","last_synced_at":"2025-04-06T18:15:06.367Z","repository":{"id":18418848,"uuid":"87642251","full_name":"dominique-mueller/simple-progress-webpack-plugin","owner":"dominique-mueller","description":"A simple progress plugin for Webpack.","archived":false,"fork":false,"pushed_at":"2024-09-14T04:35:03.000Z","size":2132,"stargazers_count":64,"open_issues_count":13,"forks_count":16,"subscribers_count":2,"default_branch":"develop","last_synced_at":"2024-10-12T08:23:57.183Z","etag":null,"topics":["logger","plugin","progress","simple","webpack"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/simple-progress-webpack-plugin","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dominique-mueller.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-04-08T15:05:32.000Z","updated_at":"2024-03-12T06:26:55.000Z","dependencies_parsed_at":"2024-10-25T18:26:17.369Z","dependency_job_id":"e4daf424-7b47-4853-a5fc-d0e79b6cd167","html_url":"https://github.com/dominique-mueller/simple-progress-webpack-plugin","commit_stats":{"total_commits":47,"total_committers":6,"mean_commits":7.833333333333333,"dds":"0.44680851063829785","last_synced_commit":"4c3a83bdac34bd8033420ee123fff139148ea647"},"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dominique-mueller%2Fsimple-progress-webpack-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dominique-mueller%2Fsimple-progress-webpack-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dominique-mueller%2Fsimple-progress-webpack-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dominique-mueller%2Fsimple-progress-webpack-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dominique-mueller","download_url":"https://codeload.github.com/dominique-mueller/simple-progress-webpack-plugin/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247526764,"owners_count":20953143,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["logger","plugin","progress","simple","webpack"],"created_at":"2024-10-11T08:24:04.728Z","updated_at":"2025-04-06T18:15:06.339Z","avatar_url":"https://github.com/dominique-mueller.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\r\n\r\n# simple-progress-webpack-plugin\r\n\r\n**A simple progress plugin for [Webpack](https://webpack.js.org/).**\r\n\r\n\u003c/div\u003e\r\n\r\n\u003cbr\u003e\u003cbr\u003e\r\n\r\n## What it does\r\n\r\n**simple-progress-webpack-plugin** is a plugin for **[Webpack](https://webpack.js.org/)**. It improves the overall Webpack Developer\r\nExperience by showing a much more detailed and also visually appealing build progress in the command line. Four different output formats are\r\navailable, from which two are ready to be used in a CI environment (such as **[GitHub Actions](https://github.com/features/actions)**).\r\n\r\n\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e\r\n\r\n## How to install\r\n\r\nYou can get the **simple-progress-webpack-plugin** via **npm** by adding it as a new _dev-dependency_ to your `package.json` file and\r\nrunning `npm install`. Alternatively, run the following command:\r\n\r\n```bash\r\nnpm install simple-progress-webpack-plugin --save-dev\r\n```\r\n\r\n### Requirements\r\n\r\n- **simple-progress-webpack-plugin** requires **NodeJS 12** (or higher) to be installed\r\n\r\n\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e\r\n\r\n## How to use\r\n\r\nTo use the plugin, import it into your Webpack configuration file and instantiate it within the list of plugins:\r\n\r\n```js\r\nconst SimpleProgressWebpackPlugin = require('simple-progress-webpack-plugin');\r\n\r\nconst webpackConfig = {\r\n  plugins: [new SimpleProgressWebpackPlugin()];\r\n}\r\n```\r\n\r\n\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e\r\n\r\n## How to customize\r\n\r\nTo customize the plugin, pass options to the constructor of the plugin:\r\n\r\n```js\r\nplugins: [\r\n  new SimpleProgressWebpackPlugin({\r\n    format: 'compact',\r\n  }),\r\n];\r\n```\r\n\r\n\u003cbr\u003e\r\n\r\n### Options\r\n\r\nThe following options exist, all of them totally optional:\r\n\r\n| Option   | Description                                                                                         |\r\n| -------- | --------------------------------------------------------------------------------------------------- |\r\n| `color`  | Use colorized console output (might not be available on some CI systems)\u003cbr\u003e→ Default value: `true` |\r\n| `format` | Logging output format\u003cbr\u003e→ Default value: `compact`                                                 |\r\n| `name`   | Name of the build\u003cbr\u003e→ Default value. `Webpack: Starting ...`                                       |\r\n\r\n\u003cbr\u003e\r\n\r\n### Logging Formats\r\n\r\nThe following is a list of available logging output formats. While `compact` is the default format, `expanded` is the recommended one for\r\nbeing used within a CI environment.\r\n\r\n#### `minimal`\r\n\r\nThe `minimal` logger prints everything into a single line, constantly updated during the build. This makes it look pretty similar to what\r\nthe **[Angular CLI](https://github.com/angular/angular-cli)** outputs during build. So, if you're a minimalist, this is probably the right\r\nlogger for you!\r\n\r\n\u003e Probably not the best choice for your CI!\r\n\r\n![Minimal Logger Preview GIF](/docs/minimal-logger-preview.gif?raw=true)\r\n\r\n#### `simple`\r\n\r\nThe `simple` logger prints each build step, omitting further details. It's simply simple!\r\n\r\n![Simple Logger Preview GIF](/docs/simple-logger-preview.gif?raw=true)\r\n\r\n#### `compact` (default)\r\n\r\nThe `compact` logger prints each build step with further details (such as the sub-progress and several sub-steps) while still not taking up\r\ntoo much space (thus the name compact).\r\n\r\n\u003e Probably not the best choice for your CI!\r\n\r\n![Compact Logger Preview GIF](/docs/compact-logger-preview.gif?raw=true)\r\n\r\n#### `expanded`\r\n\r\nThe `expanded` logger is pretty similar to the `compact` logger, but prints every sub-step into its own separate line.\r\n\r\n![Expanded Logger Preview GIF](/docs/expanded-logger-preview.gif?raw=true)\r\n\r\n#### `verbose`\r\n\r\nThe `verbose` logger logs everything. Like, everything! The full truth, every crucial detail Webpack has to offer. Best use it for\r\ndebugging purposes (or for finding bugs in this plugin).\r\n\r\n![Verbose Logger Preview GIF](/docs/verbose-logger-preview.gif?raw=true)\r\n\r\n\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e\r\n\r\n## Similar / related projects\r\n\r\n- **[Progress Bar Webpack Plugin](https://github.com/clessg/progress-bar-webpack-plugin)** is an alternative progress plugin for webpack.\r\n  However, instead of just logging out colored text it uses an animated progress bar. Perfect for anyone who likes bars more than stupid text!\r\n- **[Ghost Progress Webpack Plugin](https://github.com/ZSkycat/ghost-progress-webpack-plugin)** is a no side effects progress plugin for webpack.\r\n  It can output progress and does not affect the output log of other tools, and is more suitable for use in a development server environment.\r\n- **[Friendly Errors Webpack Plugin](https://github.com/geowarin/friendly-errors-webpack-plugin)** complements either this plugin or the\r\n  _Progress Bar Webpack Plugin_ described above. It gives developer a cleaner, more detailed screen once the build has finished. Definitely\r\n  worth checking out!\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdominique-mueller%2Fsimple-progress-webpack-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdominique-mueller%2Fsimple-progress-webpack-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdominique-mueller%2Fsimple-progress-webpack-plugin/lists"}