Jump to
Overview
A webpack preloader which transpiles ES6 lodash imports into typescript imports to help with tree-shaking.
Basically transpiles from ES6 syntax:
;
into typescript syntax:
;
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
- Install the package:
$ npm install lodash-ts-imports-loader --save-dev
Usage
In your webpack.config.js
add the lodash-ts-imports-loader
preloader:
// ...module: rules: test: /\.ts$/ loader: 'lodash-ts-imports-loader' exclude: /node_modules/ enforce: "pre" // ... // ...// ...
Now somewhere in your main.ts
typescript file add an ES6 import for 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 bundleconsole;
run webpack bundling and check your bundle size.
Update the code to:
;// 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 bundleconsole; console;
run webpack bundling and check your bundle size.
This time the bundle size should be larger.
Links
NPM:
https://www.npmjs.com/package/lodash-ts-imports-loader
GITHUB:
https://github.com/efidiles/lodash-ts-imports-loader.git
Author
Eduard Fidiles
License
[jump to TOC]
Released under the MIT license.
Copyright © 2016, Eduard Fidiles