webpack-plugin-graphql-schema-hot
v0.0.10
Published
Webpack plugin which track changes in your schema files and generate `json` and `txt` files.
Downloads
886
Maintainers
Readme
webpack-plugin-graphql-schema-hot
This is Webpack plugin which tracks changes in your GraphQL Schema files and re/generates schema introspection in json
and txt
formats. Just provide absolute path to your schema js and paths for output files in plugin options. And for every webpack rebuild plugin will check if changed files somehow related to schema and if so, will emmit new json and txt files. After that this files may be provided to eslint, babel or any other tool. Links to recommended tools can be found below.
Install
yarn add webpack-plugin-graphql-schema-hot --dev
or
npm install webpack-plugin-graphql-schema-hot --save-dev
Usage with webpack.config.js
import path from 'path';
import WebpackPluginGraphqlSchemaHot from 'webpack-plugin-graphql-schema-hot';
const config = {
// ...
plugins: [
new WebpackPluginGraphqlSchemaHot({
schemaPath: path.resolve(__dirname, '../schema/index.js'),
output: {
json: path.resolve(__dirname, '../build/schema.graphql.json'),
txt: path.resolve(__dirname, '../build/schema.graphql.txt'),
},
// output: (schemaPath) => {
// cp.execSync(
// 'npm run generate-schema',
// { cwd: path.resolve(__dirname, '../'), stdio: [0, 1, 2] }
// );
// },
runOnStart: true, // default: false
waitOnStart: 0, // default: 0, set 2000 if you use babel-plugin-transform-relay-hot
waitOnRebuild: 0, // default: 0, set 2000 if you use babel-plugin-transform-relay-hot
verbose: true, // default: false
hideErrors: false, // default: false
excludes: ['**/__generated__/**'], // default: null
}),
]
}
Options
schemaPath
- Required
- Type:
String
- Absolute path to your graphql schema js file. Only this file and its dependencies will trigger generation of new files.
output
- Required
- Type:
Function
orObject
- IfObject
: - You should providejson
and/ortxt
properties with the absolute file path. - IfFunction
:- This function may be
async
(in this case function should returnPromise
) -(schemaPath) => { /* you generation code */ }
. Sometimes you may want to generate schema in some exotic way, eg. under another babel environment. Just provide your function, which will be called instead of internal.
- This function may be
runOnStart
- Type:
Boolean
- Default:
false
- Generate schema files on start, before Webpack starts to compile your files.
- Type:
waitOnStart
- Type:
Integer
- Default:
0
- How many milliseconds wait after generating schema files on start, before Webpack proceed. If you use Relay, install babel-plugin-transform-relay-hot and set2000
, that allows to reloadrelayBabelPlugin
with new schema before Webpack proceed.
- Type:
waitOnRebuild
- Type:
Integer
- Default:
0
- How many milliseconds wait after generating schema files on rebuild, before Webpack proceed.
- Type:
verbose
- Type:
Boolean
- Default:
false
- Show more details
- Type:
hideErrors
- Type:
Boolean
- Default:
false
- Hide runtime plugin errors. If you provide wrong options to plugin, it will show startup errors evenhideErrors=true
.
- Type:
excludes
- Type:
Array of globs
- Default:
null
- Do not track changes in files which globs match filename. You should provide glob for absolute path, eg.**/temp/**
, justtemp
ortemp/
won't match all files inside the directory.
- Type:
Recommended tools
- babel-plugin-transform-relay-hot 🔥 if you use
Relay
, this plugin wraps standardbabelRelayPlugin
and hot reload it ifschema.json
file was changed without restarting dev server. - eslint-plugin-graphql 🔥 if you use
Atom
editor, this plugin may also track changes ofschema.json
file on fly. - js-graphql-intellij-plugin 🔥 if you use
WebStorm
or any other IntelliJ IDEA editor.
License
MIT