ember-cli-bundle-analyzer
An Ember CLI addon to analyze the size and contents of your app's bundled output,using an interactive zoomable treemap.
View the interactive Demo
This helps you to
- analyze which individual modules make it into your final bundle
- find out how big each contained module is, including the raw source, minified and gzipped sizes
- find modules that got there by mistake
- optimize your bundle size
It uses broccoli-concat-analyser under the hood,which in turn was inspired bywebpack-bundle-analyzer,and wraps it in Ember CLI addon to make it easy to use.
Compatibility
- Ember.js v3.12 or above
- Ember CLI v3.12 or above
- Node.js v10 or above
Installation
ember install ember-cli-bundle-analyzer
Usage
After you have started your development server using ember serve, this addon adds a custom middleware listening to/_analyze. So just open http://localhost:4200/_analyze in your web browser to access the analyzer output.
While it processes the data, which can take a while due to live minification and compression of all involved modules,a loading screen is displayed. After processing has finished you should see the final output.
Live reloading is supported, so whenever you change a project file the output will be re-computed and updated.
Options
You can customize the precessing by setting any of the following options into the 'bundle-analyzer' key of yourember-cli-build.js:
ignoreTestFiles(boolean): by default it will exclude all test files from the output. Set this tofalseto includethem.ignore(string | string[]): add files to ignore. Glob patterns are supported, e.g.*-fastboot.js.
Contributing
See the Contributing guide for details.
License
This project is licensed under the MIT License.
-
安装 # NPM npm install --save-dev webpack-bundle-analyzer # Yarn yarn add -D webpack-bundle-analyzer 配置 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; const pat
-
webpack插件的github地址是： https://github.com/webpack-contrib/webpack-bundle-analyzer/ 安装 npm install --save-dev webpack-bundle-analyzer package.json "dev": "cross-env webpack-dev-server --open --config .
-
这里介绍一些常用的webpack打包优化解决方案 使用插件查看项目所有包及体积大小 查看项目打包 webpack有个插件，可以查看项目打包，每个包的体积，每个包里面的包一些情况。 首先下载插件 $ npm intall webpack-bundle-analyzer --save-dev 复制代码 其次项目中配置（webpack.prod.conf.js文件中配置） if (config.buil
-
前言 首先，这是一个webpack的插件，需要配合webpack和webpack-cli一起使用。这个插件的功能是生成代码分析报告，帮助提升代码质量和网站性能。 安装 # NPM npm install --save-dev webpack-bundle-analyzer # Yarn yarn add -D webpack-bundle-analyzer 复制代码 使用方法一 1、配置web
-
Ember CLI 是一个 Ember.js 命令行工具，提供了由 broccoli 提供的快速的资源管道和项目结构。 Ember CLI 基于 Ember App Kit Project 目前已经废弃。 Assets Compilation Ember CLI asset compilation is based on broccoli. Broccoli has support for: Ha
-
This repository is no longer maintained. As a replacement check out: https://github.com/sir-dunxalot/ember-tooltips Ember CLI Tooltipster An Ember CLI add-on that wraps Tooltipster into an ember compo
-
ember-cli-updater This ember-cli addon helps you update your ember-cli application or addon. The idea of this addon is to automate some parts of the upgrade process so it's simplified. Not every chang
-
Ember-cli-yadda This Ember CLI addon facilitates writing BDD tests in the Gherkin language and executing them against your Ember app. @mschinis (Micheal Schinis) Did a great talk at @emberlondon BDD a
-
Ember-cli-simditor Ember component wrapper for simditor. Changes 0.0.7 Different from previous version, you must wrap content in object. See issue 6 for why. Getting Started Installation In your ember
-
ember-cli-chai Chai assertions for Ember.js. Deprecated This package is deprecated. Please use ember-auto-import to use chai and chai plugins directly. If you'd like to use chai, or were previously us