|
2 | 2 |
|
3 | 3 | # JS GraphQL IntelliJ Plugin |
4 | 4 |
|
5 | | -__Note:__ V2.0 is in active development. See the [v2 branch](https://github.com/jimkyndemeyer/js-graphql-intellij-plugin/tree/v2) and [#164]( https://github.com/jimkyndemeyer/js-graphql-intellij-plugin/issues/164) |
| 5 | +GraphQL language support for WebStorm, IntelliJ IDEA and other IDEs based on the IntelliJ Platform. |
6 | 6 |
|
7 | | -GraphQL language support including Relay.QL tagged templates in JavaScript and TypeScript. |
8 | | - |
9 | | -It provides the following features in IntelliJ IDEA, WebStorm, RubyMine, PhpStorm, and PyCharm: |
| 7 | +## Features overview |
10 | 8 |
|
| 9 | +- Full language support for the June 2018 GraphQL Specification including the Type System Definition Language (SDL) |
| 10 | +- The plugin discovers your local schema on the fly. Remote schemas are easily fetched using introspection |
| 11 | +- Schema discovery is configured using [graphql-config](https://github.com/prisma/graphql-config) files, including support for multi-schema projects |
| 12 | +- Built-in support for Relay and Apollo projects: `graphql` and `gql` tagged template literals in JavaScript and TypeScript are automatically recognized as GraphQL |
| 13 | +- Execute queries using variables against configurable endpoints, including support for custom headers and environment variables |
11 | 14 | - Schema-aware completion, error highlighting, and documentation |
12 | 15 | - Syntax highlighting, code-formatting, folding, commenter, and brace-matching |
13 | | -- 'Find Usages' and 'Go to Declaration' for schema types and fields |
14 | | -- Schema viewer and 'Go to Implementation' for schema interfaces |
15 | | -- 'Structure view' to navigate GraphQL and GraphQL Schema files |
16 | | -- Configurable GraphQL schema retrieval and reloading based on a local file or a url using 'then-request' |
17 | | -- Execute queries with variables against configurable endpoints |
18 | | - |
19 | | -V1.x depends on [js-graphql-language-service](https://github.com/jimkyndemeyer/js-graphql-language-service) that it manages using a Node.js process handler. |
20 | | - |
21 | | -## Installation |
22 | | -1. Install Node JS |
23 | | -``` |
24 | | -# Ubuntu |
25 | | -sudo apt install nodejs |
26 | | -
|
27 | | -# Mac OS |
28 | | -brew install node |
29 | | -``` |
30 | | - |
31 | | -2. Install Node JS and JS GraphQL Plugin in IntelliJ |
32 | | -``` |
33 | | -1. File | Settings | Plugins |
34 | | -2. Search for: nodejs and graphql |
35 | | -3. Install both plugins and Restart |
36 | | -``` |
37 | | - |
38 | | -3. Set Node JS Interpreter in IntelliJ |
39 | | -``` |
40 | | -1. File | Settings | Languages & Frameworks | Node.js and NPM Node interpreter |
41 | | -2. Add... (search for nodejs bin path in your system) |
42 | | -
|
43 | | -# Ubuntu |
44 | | -whereis nodejs |
45 | | -/usr/bin/nodejs |
46 | | -
|
47 | | -# Mac OS |
48 | | -which node |
49 | | -
|
50 | | -# Windows |
51 | | -where node |
52 | | -``` |
53 | | -At this point JS GraphQL will recognize your `.graphql` files. However, if you wish to customize your schema, follow the FAQ. |
| 16 | +- 'Find Usages' and 'Go to Declaration' for schema types, fields, and fragments |
| 17 | +- 'Structure view' to navigate GraphQL files |
54 | 18 |
|
55 | 19 | ## Documentation |
56 | 20 |
|
57 | | -The plugin uses a `graphql.config.json` file in the project root to configure the location of your GraphQL schema. |
58 | | - |
59 | | -To get started, please see the [FAQ](#faq). |
60 | | - |
61 | | -## Features demo |
62 | | - |
63 | | -**Schema setup, completion, error highlighting, documentation** |
64 | | - |
65 | | - |
66 | | -**Find usages, schema viewer, structure view** |
67 | | - |
68 | | - |
69 | | -## FAQ |
70 | | - |
71 | | -**How do I configure the plugin in a project** |
72 | | - |
73 | | -The plugin is activated as soon as you view or edit GraphQL in the editor. This includes GraphQL inside `Relay.QL` and `gql` templates in JavaScript and TypeScript. You can also use `.graphql` physical files and scratch files. These files allow you to query your endpoint directly from your IDE. |
74 | | - |
75 | | -An editor notification bar should prompt you to "Create a graphql.config.json". Accept and edit this config file to point the plugin at your local `schema.json` or your endpoint for introspection. The plugin uses the schema to provide completion and error highlighting. |
76 | | - |
77 | | -**How do I reload a GraphQL Schema that was loaded from a URL?** |
78 | | - |
79 | | -In the the GraphQL tool window, select the "Current Errors" tab and click the "Restart JS GraphQL Language Service" button. |
80 | | - |
81 | | -**I clicked "No thanks" when asked to create a graphql.config.json. Now what?** |
82 | | - |
83 | | -Download [graphql.config.json](https://github.com/jimkyndemeyer/js-graphql-intellij-plugin/blob/master/resources/META-INF/graphql.config.json) from this repository and place it in your project root (next to your package.json for JS projects). Re-open the project and edit `graphql.config.json` to point the plugin at your schema. |
| 21 | +The main documentation site is available at https://jimkyndemeyer.github.io/js-graphql-intellij-plugin/ |
84 | 22 |
|
85 | | -**Fields are shown as errors with "Cannot query field..." messages** |
| 23 | +## Which IDEs are compatible with the plugin? |
86 | 24 |
|
87 | | -Make sure you've edited your `graphql.config.json` to point it at your schema. This enables the plugin to properly recognize the available types and their fields. |
| 25 | +The plugin is compatible with version 2018.2+ (182.711 or later) of all IDEs based on the IntelliJ Platform, including but not limited to WebStorm, IntelliJ IDEA, Android Studio, RubyMine, PhpStorm, and PyCharm. |
88 | 26 |
|
89 | | -**Which IDEs are compatible with the plugin?** |
| 27 | +## Where can I get the plugin? |
90 | 28 |
|
91 | | -The plugin is compatible with version 143+ of IntelliJ IDEA, WebStorm, RubyMine, PhpStorm, and PyCharm. |
| 29 | +The plugin is published to the [JetBrains Plugin Repository](https://plugins.jetbrains.com/plugin/8097?pr=). |
92 | 30 |
|
93 | | -PyCharm CE is not supported since the plugin depends on two other plugins: NodeJS and JavaScript. |
| 31 | +To install it, open your IDE "Settings", "Plugins", "Marketplace" and search for "GraphQL". |
94 | 32 |
|
95 | | -Experimental support for Android Studio is available in the [`android-studio`](https://github.com/jimkyndemeyer/js-graphql-intellij-plugin/tree/android-studio) branch. Download it from there. |
| 33 | +## Acknowledgements |
96 | 34 |
|
97 | | -**Where can I get the plugin?** |
| 35 | +This plugin was heavily inspired by [GraphiQL](https://github.com/graphql/graphiql) from Facebook. |
98 | 36 |
|
99 | | -The plugin is available from the JetBrains Plugin Repository at https://plugins.jetbrains.com/plugin/8097?pr= |
| 37 | +A number of language features such as query and schema validation are powered by [graphql-java](https://github.com/graphql-java/graphql-java). |
100 | 38 |
|
101 | | -To install it, open "Settings", "Plugins", "Browse repositories..." and search for "GraphQL". |
| 39 | +A thanks also goes out to the [Apollo](https://github.com/apollographql) and [Prisma](https://github.com/prisma) teams for their continued efforts to improve the GraphQL Developer Experience. |
102 | 40 |
|
103 | | -**Note**: The experimental version in the `android-studio` branch is not available from the JetBrains Plugin Repository. |
| 41 | +And finally, a thank you to the [JetBrains WebStorm team](https://twitter.com/WebStormIDE) and the Alpha/Beta testers for all their help in getting the 2.0 release across the finish line. |
104 | 42 |
|
105 | 43 | ## License |
106 | 44 | MIT |
0 commit comments