typescript - Hvorfor treeshaker ikke Rollup.js biblioteket mitt

Jeg har et verktøybibliotek: goodcore som jeg bruker i et annet prosjekt. Det fungerer bra, men når jeg bruker Rollup for å bunte og treeskake det, inkluderer det alltid hele goodcore-biblioteket, selv når jeg bare bruker en veldig liten del av det som ikke har noen forbindelse i det hele tatt med noen av de inkluderte filene.

Begge prosjektene er skrevet i Typescript og bruker ES2015-modulinnlasting.

Jeg refererer til goodcore-biblioteket ved å bruke:

import { Arr, Pool, Range2, Timer, Util, Vec2 } from "goodcore";

og index.js i goodcore ser ut som:

export { Vec2 as Vec2 } from "./struct/Vec2";
export { Range2 as Range2 } from "./struct/Range2";
export { Rect as Rect } from "./struct/Rect";
export { List as List } from "./struct/List";
export { Dictionary as Dictionary } from "./struct/Dictionary";
export { Stack as Stack } from "./struct/Stack";
export { Tree as Tree } from "./struct/Tree";
export { Calc as Calc } from "./Calc";
export { Dom as Dom } from "./Dom";
export { Arr as Arr } from "./Arr";
export { Obj as Obj } from "./Obj";
export { Util as Util } from "./Util";
export { Timer as Timer } from "./Timer";
export { Uri as Uri } from "./Uri";
export { Poolable as Poolable } from "./standard/mixins/Poolable";
export { Initable as Initable } from "./standard/mixins/Initable";
export { Pool as Pool } from "./standard/Pool";
export { Integrate as Integrate } from "./Integration";
export { MocData as MocData } from "./MocData";
export { Cache as Cache } from "./standard/Cache";
export { KeyValuePair as KeyValuePair } from "./struct/KeyValuePair";
//# sourceMappingURL=index.js.map

Likevel ender jeg opp med alt fra goodcore, som Tree, inkludert i min rollup-build av det andre prosjektet, mens jeg hadde inntrykk av at treeshaking skulle fjerne ting som ikke ble brukt/referert.

Rollup-konfigurasjonen for det andre prosjektet ser slik ut:

var packageJson = require("./package.json");
import resolve from 'rollup-plugin-node-resolve';
import typescript from 'rollup-plugin-typescript2';
export default {
    entry: 'src/lib/index.ts',
    targets: [
            { dest: 'dist/' + packageJson.name + '.umd.js', format: 'umd' },
            { dest: 'dist/' + packageJson.name + '.es.js', format: 'es' },
            { dest: 'dist/' + packageJson.name + '.iife.js', format: 'iife' }
    ],
    moduleName: packageJson.name,
    external: ['ts-md5/dist/md5'],
    sourceMap: true,
    globals: {
    },
    treeshake: true,
    plugins: [
        typescript({
            typescript: require('typescript')
        }),
        resolve({ module: true, jsnext: false, main: true, modulesOnly: true })
    ]
}

Hva gjør jeg galt?

Svar #1

For å sikre korrekthet vil Rollup inkludere all kode som ser ut til å kunne ha bivirkninger — for å gi et trivielt eksempel, vil denne bundelen føre til at 'hello from foo.js' blir logget selv om foo ikke importeres av main.js:

/*--- main.js ---*/
import './foo.js';

/*--- foo.js  ---*/
export function unused () {
  // this will be omitted...
}

// but this will be included, because it has an effect on the world
console.log('hello from foo.js');

I tilfellet med goodcore ser alt ut til å Rollup som om det kan ha bivirkninger. For eksempel er Calc resultatet av å kalle _Calc(), og siden det er veldig vanskelig å avgjøre om _Calc() har effekter, må det inkluderes uansett om Calc brukes av pakken eller ikke. Dette kan du se i REPL.

Dessverre vil det å gjøre denne koden treeshakebar sannsynligvis innebære ganske betydelige endringer i designet. Det er også mulig at TypeScript introduserer konstruksjoner som ikke kan treeshakes.

Relaterte artikler