https://github.com/happylynx/flow-webpack-plugin
A webpack plugin allowing to call Flow type checker.
https://github.com/happylynx/flow-webpack-plugin
flow flowtype typechecking webpack-plugin
Last synced: 4 months ago
JSON representation
A webpack plugin allowing to call Flow type checker.
- Host: GitHub
- URL: https://github.com/happylynx/flow-webpack-plugin
- Owner: happylynx
- Created: 2016-12-30T00:12:50.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2019-03-01T04:16:32.000Z (over 6 years ago)
- Last Synced: 2024-10-30T08:56:45.329Z (7 months ago)
- Topics: flow, flowtype, typechecking, webpack-plugin
- Language: JavaScript
- Homepage:
- Size: 363 KB
- Stars: 36
- Watchers: 2
- Forks: 6
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# flow-webpack-plugin
A webpack plugin allowing to call [Flow][2] type checker during each webpack compilation.
[]()
[]()
[]()
[]()
## Key features
* It doesn't require `flow` to be in `$PATH`.
* No dependencies. Plugin can reuse project's `flow-bin` installation.
* It can make `webpack` to exit with non-zero return code, if flow validation fails.
* It works per project, not per file.
## Installation
Run in you project directory:
```
npm install --save-dev flow-webpack-plugin flow-bin
```
or using yarn:
```
yarn add flow-webpack-plugin flow-bin --dev
```
Add to your webpack configuration file `webpack.config.js`:
```js
const FlowWebpackPlugin = require('flow-webpack-plugin')
module.exports = {
plugins: [
new FlowWebpackPlugin(),
// ...
],
// ...
}
```
*Note:* `flow-bin` package is not a hard dependency. If flow is already installed on your system,
it can be reused through `flowPath` option.
[Demo project][4] illustrates integration of Webpack, Flow and Babel using this plugin.
## Screenshots
Valid codebase:
Flow validation error:
## Configuration
Constructor of `FlowWebpackPlugin` accepts optional configuration object of following properties:
```js
const FlowWebpackPlugin = require('flow-webpack-plugin')
new FlowWebpackPlugin({
failOnError: false,
failOnErrorWatch: false,
reportingSeverity: 'error',
printFlowOutput: true,
flowPath: require.main.require('flow-bin'),
flowArgs: ['--color=always'],
verbose: false,
callback: (result) => {}
})
```
| option | type | default value | description |
| --- | --- | --- | --- |
| `failOnError` | `boolean` | `false` | Webpack exits with non-zero error code if flow typechecking fails. |
| `failOnErrorWatch` | `boolean` | `false` | Webpack in watch mode exits with non-zero error code if flow typechecking fails. |
| `reportingSeverity` | 'warning' | 'error' | `'error'` | Webpack severity level of reported flow type problems. When using webpack-dev-server, page reload is blocked in case of webpack error. `warning` can be used to enable page reloads in case of flow errors when using webpack-dev-server. |
| `printFlowOutput` | `boolean` | `true` | `true` ~ Output of `flow` is printed at the end of webpack compilation in case of error, `false` ~ output of `flow` is discarded. |
| `flowPath` | `string` | `require('flow-bin')` if `flow-bin` package is installed. Otherwise the parameter is required. | Path to flow executable. It may be both absolute, relative to the 'cwd' of webpack process or just name of an executable on the PATH.
| `flowArgs` | `Array` | `['--color=always']` if standard output is directed to a terminal, otherwise `[]` | Flow command line arguments. See [flow cli documentation][1]. |
| `verbose` | `boolean` | `false` | It enables plugin logging for debug purposes. |
| `callback` | `({exitCode: number, stdout: string, stderr: string}) => ?Promise` | `(result) => {}` | Custom user function that is called when Flow check finishes and is passed Flow type check result. If function returns a promise, it is called asynchronously. |
## Type annotations strip
This plugin performs type validation of the code. To remove the Flow type annotations and
create pure Javascript code [babel-plugin-transform-flow-strip-types][3] can be used.
[1]: https://flowtype.org/docs/cli.html
[2]: https://flowtype.org
[3]: https://www.npmjs.com/package/babel-plugin-transform-flow-strip-types
[4]: demo-projects/webpack-3