Have ideas to improve npm?Join in the discussion! »

    lodash-ts-webpack-plugin

    1.1.4 • Public • Published

    Jump to

    Overview

    [jump to TOC]

    Transforms lodash function imports into sub-modules imports, which allows for a tree-shaking.

    It transforms from:

    import { debounce } from 'lodash';

    to:

    import debounce from 'lodash/debounce';

    before the source code is being taken through the typescript compiler.

    This way webpack 2 will be able to only include the code that's being actually used.

    Installation

    [jump to TOC]

    1. Install the package:
    $ npm install lodash-ts-webpack-plugin --save-dev

    Usage

    [jump to TOC]

    In your webpack.config.js add the lodash-ts-webpack-plugin preloader:

    // ...
    module: {
        rules: [
            {
                test: /\.ts$/,
                loader: 'lodash-ts-webpack-plugin',
                exclude: /node_modules/,
                enforce: 'pre'
            },
            // ...
        ],
        // ...
    }
    // ...

    Now somewhere in your main.ts typescript file add an ES6 import for lodash:

    import { debounce } from 'lodash';
    // make sure you have this line as well otherwise you're not using the import member
    // and the lodash code will not be included in the bundle
    console.log(debounce); 

    run webpack bundling and check your bundle size.

    Update the code to:

    import { debounce, zip } from 'lodash';
    // make sure you have this lines as well otherwise you're not using the import members
    // and the lodash code will not be included in the bundle
    console.log(debounce); 
    console.log(zip); 

    run webpack bundling and check your bundle size.
    This time the bundle size should be larger.

    Links

    [jump to TOC]

    NPM:
    https://www.npmjs.com/package/lodash-ts-webpack-plugin
    GITHUB:
    https://github.com/impankratov/lodash-ts-webpack-plugin.git

    Authors

    [jump to TOC]

    Eduard Fidiles

    Ivan Pankratov

    License

    [jump to TOC]
    Released under the MIT license.

    Copyright © 2017, Eduard Fidiles, Ivan Pankratov

    Install

    npm i lodash-ts-webpack-plugin

    DownloadsWeekly Downloads

    122

    Version

    1.1.4

    License

    MIT

    Last publish

    Collaborators

    • avatar