typewiz-webpack
A Webpack plugin that automatically adds types to TypeScript code using typewiz-core
Prerequisites
Make sure you are using a recent version of webpack-dev-server. Version 2.9.0 or newer is required.
Installation
First, install the plugin:
yarn add typewiz-webpack
or
npm install --save typewiz-webpack
Then, add typewiz-webpack
to your list of loaders, just after your usual TypeScript loader. e.g.:
module: rules: test: /\.tsx?$/ loaders: 'awesome-typescript-loader' 'typewiz-webpack'
Optionally you can also specify the path to your typewiz.json file:
module: rules: test: /\.tsx?$/ loaders: 'awesome-typescript-loader' loader:'typewiz-webpack' options: typewizConfig: path
Next, add TypewizPlugin
to your list of plugins, and configure
your webpack-dev-server to save the collected type info to disk using the provided typewizCollectorMiddleware
middleware. Here is an example of what your final config file may look like:
const CheckerPlugin = ;const TypewizPlugin typewizCollectorMiddleware = ; moduleexports = resolve: extensions: '.ts' '.tsx' '.js' '.jsx' devtool: 'source-map' module: rules: test: /\.tsx?$/ loaders: 'awesome-typescript-loader' 'typewiz-webpack' plugins: devServer: { ; } ;
Finally, run your app with webpack. The collected type information will be saved to disk inside collected-types.json
. To apply the types to your source code install the typewiz cli and run the apply command:
typewiz applyTypes collected-types.json
Check out typewiz-webpack-demo for a complete example of WebPack + TypeWiz setup.
Example
Given the following input file:
console.loggreet'Uri';
After instrumenting the code with the plugin, collecting the types and applying them, you will get the following result:
console.loggreet'Uri';
Note the addition of the : string
type for the who
parameter in the first line.
License
MIT