tivac / rollup-plugin-sizes Goto Github PK

View Code? Open in Web Editor NEW

91.0 3.0 12.0 1.46 MB

Rollup plugin to display bundle contents & size information

License: MIT License

JavaScript 100.00%

rollup-plugin metadata optimization rollup

rollup-plugin-sizes's Introduction

rollup-plugin-sizes

Simple analysis on rollup bundling, helping you to spot libaries bloating up your bundles.

/src/index.js:
codemirror - 446.92 KB (35.94%)
remarkable - 193.72 KB (15.58%)
app - 95.87 KB (7.71%)
autolinker - 81.64 KB (6.57%)
lodash.filter - 62.77 KB (5.05%)
...

or with way more details!

/src/index.js:
codemirror - 446.92 KB (35.94%)
        lib\codemirror.js - 347.8 KB (77.82%)
        mode\javascript\javascript.js - 27.78 KB (6.22%)
        mode\markdown\markdown.js - 25.54 KB (5.72%)
        mode\meta.js - 14.44 KB (3.23%)
        mode\xml\xml.js - 12.52 KB (2.80%)
        addon\edit\closebrackets.js - 7.04 KB (1.58%)
        addon\edit\matchbrackets.js - 5.39 KB (1.21%)
        addon\comment\continuecomment.js - 3.59 KB (0.80%)
        addon\selection\active-line.js - 2.82 KB (0.63%)
remarkable - 193.72 KB (15.58%)
        lib\common\entities.js - 46.44 KB (23.97%)
        lib\rules.js - 10.2 KB (5.26%)
        lib\rules_block\list.js - 6.65 KB (3.43%)
        lib\ruler.js - 5.44 KB (2.81%)
        lib\rules_block\deflist.js - 5.22 KB (2.69%)
...

Install

$ npm i rollup-plugin-sizes -D

Usage

Add to your rollup build as the last plugin via JS API or Config file.

JS API

var rollup = require("rollup"),

    buble = require("rollup-plugin-buble"),
    sizes = require("rollup-plugin-sizes");

rollup.rollup({
    entry   : "src/main.js",
    plugins : [
        buble(),
        sizes()
    ]
}).then(function(bundle) {
    ...
});

Config file

import buble from 'rollup-plugin-buble';
import sizes from 'rollup-plugin-sizes';

export default {
    ...
    plugins : [
        buble(),
        sizes()
    ]
};

Options

details - Set to true to enable file-by-file breakdowns of space usage.

report - Customize reporting. See source code for the default reporter.

rollup-plugin-sizes's People

Contributors

Stargazers

Watchers

Forkers

timdp krixi hash-bang thdk davidbabel fuzetsu ryuno-ki mohanraj-r tanishalfelven twipped prantlf tbouffard

rollup-plugin-sizes's Issues

Report is showing multiple times

Hey there. I'm noticing that if I have multiple outputs, I get an analysis for each one, but without distinction on which report belongs to which output. Here is my Rollup config:

import babel from 'rollup-plugin-babel'
import commonjs from 'rollup-plugin-commonjs'
import postcss from 'rollup-plugin-postcss'
import resolve from 'rollup-plugin-node-resolve'
import sizes from 'rollup-plugin-sizes'

import pkg from './package.json'

export default {
  input: 'src/index.js',
  output: [
    {
      file: pkg.main,
      format: 'cjs'
    },
    {
      file: pkg.module,
      format: 'es'
    }
  ],
  external: [
    'react',
    'react-dom',
    'prop-types'
  ],
  plugins: [
    postcss({}),
    babel({
      exclude: 'node_modules/**'
    }),
    resolve(),
    commonjs(),
    sizes()
  ]
}

And build stdout:

src/index.js → dist/index.js, dist/index.es.js...
src/index.js:
rollup helpers - 12.87 KB (61.51%)
app - 6.48 KB (30.96%)
invariant - 1.58 KB (7.53%)
src/index.js:
rollup helpers - 12.87 KB (61.51%)
app - 6.48 KB (30.96%)
invariant - 1.58 KB (7.53%)

Thanks in advance.

Add support for rollup@3

Hi and thanks for this plugin

[email protected] declares "rollup": "^2.0.0" in peerDependencies

Running npm install in a projet using rollup@3 generates the following error

npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/rollup
npm ERR!   dev rollup@"~3.7.5" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer rollup@"^2.0.0" from [email protected]
npm ERR! node_modules/rollup-plugin-sizes
npm ERR!   dev rollup-plugin-sizes@"~1.0.4" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/rollup
npm ERR!   peer rollup@"^2.0.0" from [email protected]
npm ERR!   node_modules/rollup-plugin-sizes
npm ERR!     dev rollup-plugin-sizes@"~1.0.4" from the root project

Workaround: use the --legacy-peer-deps option

Hi Pat,
I tried running sizes() on my project and saw some numbers that were hard to verify. I put it against a vanilla sample project: https://gist.github.com/Rich-Harris/cb14f4bc0670c47d00d191565be36bf0
and got this output:
main.jsx:
react-dom - 562.46 KB (437.96%)
react - 112.67 KB (87.73%)
fbjs - 34.35 KB (26.75%)
object-assign - 2.24 KB (1.74%)
app - 169 B (0.13%)

What I don't get is why one would see percentages/sums greater than 100%, and what the actual impact of react-dom might be. Is rollup tree-shaking breaking the plugin output data?

Please use the github releases

sizes plugin incompatible with rollup v0.60.0

[!] TypeError: Cannot read property 'modules' of undefined
TypeError: Cannot read property 'modules' of undefined
at Object.ongenerate (/Users/mscholz/prj/webclient/node_modules/rollup-plugin-sizes/index.js:62:28)
at /Users/mscholz/prj/webclient/node_modules/rollup/dist/rollup.js:21676:58
at Array.map ()
at /Users/mscholz/prj/webclient/node_modules/rollup/dist/rollup.js:21675:34
at

Update peerDependency of Rollup

Hey there!

Thanks for this plugin! It's useful for game jams like js13kgames :-)

One small favour I'd like to ask you for, though.
Could you update the peerDependency of Rollup?

rollup-plugin-sizes/package.json

Line 38 in 8bf28ff

"rollup": "^1.0.0"

I've tested, it works with v2 (at least for me).
This would also require a new releast to npm.

Thanks!

Work with rollup-plugin-typescript2 leads to error

Version:
"rollup-plugin-sizes": "^1.0.1"
"rollup-plugin-typescript2": "^0.26.0"

Reason:
the rollup-plugin-typescript2 will generate .d.ts file, but the bundle dose not have modules property, so then the generateBundle method will throw error

sizes plugin incompatible with rollup code-splitting

Like in
http://www.syntaxsuccess.com/viewarticle/lazy-loading-with-rollup

./src/App.js, ./src/ModuleA.js, ./src/ModuleB.js → ./dev...
[!] TypeError: Path must be a string. Received [ './src/App.js', './src/ModuleA.js', './src/ModuleB.js' ]
TypeError: Path must be a string. Received [ './src/App.js', './src/ModuleA.js', './src/ModuleB.js' ]
    at assertPath (path.js:28:11)
    at Object.dirname (path.js:1364:5)
    at Object.options (/Users/mscholz/exprment/webclient/node_modules/rollup-plugin-sizes/index.js:53:26)
    at /Users/mscholz/exprment/webclient/node_modules/rollup/dist/rollup.js:19063:31
    at Array.reduce (<anonymous>)
    at new Graph (/Users/mscholz/exprment/webclient/node_modules/rollup/dist/rollup.js:19061:32)
    at Object.rollup (/Users/mscholz/exprment/webclient/node_modules/rollup/dist/rollup.js:19630:23)
    at build (/Users/mscholz/exprment/webclient/node_modules/rollup/bin/rollup:3334:19)
    at /Users/mscholz/exprment/webclient/node_modules/rollup/bin/rollup:3970:20
    at next (/Users/mscholz/exprment/webclient/node_modules/rollup/bin/rollup:2781:16)

Is there a way to get sizes post-tree-shaking post-minification?

Ongenerate hook is deprecated

I got this warning :

(!) rollup-plugin-sizes plugin: The ongenerate hook used by plugin rollup-plugin-sizes is deprecated. The generateBundle hook should be used instead.

May be good to move it to newer version

Doesn't work?

I can't get this to work - the plugin just errors out.

Looks like it's using an outdated API?

(!) rollup-plugin-sizes plugin: The ongenerate hook used by plugin rollup-plugin-sizes is deprecated. The generateBundle hook should be used instead.
[!] (rollup-plugin-sizes plugin) TypeError: details.bundle.modules.forEach is not a function
TypeError: details.bundle.modules.forEach is not a function
    at Object.ongenerate (/mnt/c/workspace/kodus-content-ui/node_modules/rollup-plugin-sizes/index.js:62:36)
    at /mnt/c/workspace/kodus-content-ui/node_modules/rollup/dist/rollup.js:16611:25
    at process._tickCallback (internal/process/next_tick.js:68:7)

Here's my rollup.config.js:

import typescript from 'rollup-plugin-typescript2';
import postcss from 'rollup-plugin-postcss';
import { terser } from "rollup-plugin-terser";
import sizes from 'rollup-plugin-sizes';

export default [
    {
        input: "typescript/editor.ts",
        inlineDynamicImports: true,
        external: [
            "media",
            "content_lang",
        ],
        output: {
            file: "assets/js/editor.js",
            format: "amd",
            sourcemap: true,
        },
        plugins: [
            sizes(),
            postcss({
                extract: "assets/css/editor.css",
                sourceMap: true,
            }),
            typescript({
                typescript: require("typescript"),
                tsconfig: "typescript/tsconfig.json",
            }),
            terser()
        ]
    }
];

Have tried placing sizes() both first and last in the plugins list - it's the same error.

Installed package versions:

[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]

Add support for rollup@4