[monaco-graphql] Cannot use the monaco-editor-webpack features toggle
- Dominant language
- TypeScript
- Stars
- 16.9k
- Forks
- 1.9k
- Avg merge
- 22h 45m
- Merged PRs (30d)
- 70
Description
### Is there an existing issue for this?
- [X] I have searched the existing issues
### Current Behavior
I'm trying to use the [monaco-editor-webpack-plugin ](https://www.npmjs.com/package/monaco-editor-webpack-plugin) in combination with `monaco-graphql` and I am trying to disable some features using the new `features` flag.
However, the disabling of the flag does not work.
Here is my webpack config
```ts
new MonacoWebpackPlugin({
languages: ['json', 'typescript', 'graphql'],
features: ['!readOnlyMessage'],
customLanguages: [
{
entry: undefined,
label: 'graphql',
worker: {
id: 'graphql',
entry: require.resolve('monaco-graphql/esm/graphql.worker.js'),
},
},
],
}),
```
I traced the issue and it turns out that `monaco-graphql` imports `edcore.main` [here](https://github.com/graphql/graphiql/blob/main/packages/monaco-graphql/src/monaco-editor.ts#L22) which in turns imports all the features by default through `editor.all.js`
### Expected Behavior
the features flag should be respected.
I think the solution is to only import from `monaco-editor/esm/vs/editor/editor.api` anywhere in `monaco-graphql`.
Especially in `initializeMode.ts`. It should be possible since the only thing we need is `language`
Edit: importing from `monaco-editor/esm/vs/editor/editor.api` is actually what the doc recommends/requires when using the webpack plugin.
Anything else (features, language workers, etc) should be imported/initialized by the developer in their own project through import 'monaco-editor`.
### Steps To Reproduce
_No response_
### Environment
* GraphiQL Version:
* OS:
* Browser:
* Bundler:
* `react` Version:
* `graphql` Version:
### Anything else?
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.