Skip to content

Commit e5d68e9

Browse files
elchininetelchininet
authored
docs(monaco): update documentation to match the current API status (#255)
1 parent 15fa6bf commit e5d68e9

File tree

1 file changed

+41
-24
lines changed

1 file changed

+41
-24
lines changed

‎packages/monaco/README.md‎

Lines changed: 41 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,16 @@ We assume you already know:
2222
// my-lang.worker.ts
2323
import * as worker from 'monaco-editor-core/esm/vs/editor/editor.worker';
2424
import type * as monaco from 'monaco-editor-core';
25-
import { createSimpleWorkerLanguageService, ServiceEnvironment } from '@volar/monaco/worker';
25+
import type { LanguageServiceEnvironment } from '@volar/language-service';
26+
import { createSimpleWorkerLanguageService } from '@volar/monaco/worker';
27+
import { URI } from 'vscode-uri';
2628

2729
self.onmessage = () => {
2830
worker.initialize((ctx: monaco.worker.IWorkerContext) => {
29-
const env: ServiceEnvironment = {
30-
workspaceFolder: 'file:///',
31+
const env: LanguageServiceEnvironment = {
32+
workspaceFolders: [
33+
URI.parse('file:///'),
34+
],
3135
};
3236
return createSimpleWorkerLanguageService({
3337
workerContext: ctx,
@@ -48,16 +52,19 @@ self.onmessage = () => {
4852
```diff
4953
import * as worker from 'monaco-editor-core/esm/vs/editor/editor.worker';
5054
import type * as monaco from 'monaco-editor-core';
51-
-import { createSimpleWorkerLanguageService, ServiceEnvironment } from '@volar/monaco/worker';
52-
+import { createTypeScriptWorkerLanguageService, ServiceEnvironment } from '@volar/monaco/worker';
53-
+import * as ts from 'typescript';
54-
+import { create as createTypeScriptPlugins } from 'volar-service-typescript';
55-
+import { URI } from 'vscode-uri';
55+
import type { LanguageServiceEnvironment } from '@volar/language-service';
56+
-import { createSimpleWorkerLanguageService } from '@volar/monaco/worker';
57+
+import { createTypeScriptWorkerLanguageService } from '@volar/monaco/worker';
58+
import { URI } from 'vscode-uri';
59+
+import { create as createTypeScriptServicePlugin } from 'volar-service-typescript';
60+
+import ts from 'typescript';
5661

5762
self.onmessage = () => {
5863
worker.initialize((ctx: monaco.worker.IWorkerContext) => {
59-
const env: ServiceEnvironment = {
60-
workspaceFolder: 'file:///',
64+
const env: LanguageServiceEnvironment = {
65+
workspaceFolders: [
66+
URI.parse('file:///'),
67+
],
6168
};
6269
- return createSimpleWorkerLanguageService({
6370
+ return createTypeScriptWorkerLanguageService({
@@ -76,7 +83,7 @@ self.onmessage = () => {
7683
],
7784
languageServicePlugins: [
7885
// ...
79-
+ ...createTypeScriptPlugins(ts),
86+
+ ...createTypeScriptServicePlugin(ts),
8087
],
8188
});
8289
});
@@ -88,34 +95,38 @@ self.onmessage = () => {
8895
```diff
8996
import * as worker from 'monaco-editor-core/esm/vs/editor/editor.worker';
9097
import type * as monaco from 'monaco-editor-core';
91-
import { createTypeScriptWorkerLanguageService, ServiceEnvironment } from '@volar/monaco/worker';
98+
import type { LanguageServiceEnvironment } from '@volar/language-service';
99+
import { createTypeScriptWorkerLanguageService } from '@volar/monaco/worker';
100+
import { URI } from 'vscode-uri';
92101
+import { createNpmFileSystem } from '@volar/jsdelivr';
93-
import * as ts from 'typescript';
94-
import { create as createTypeScriptService } from 'volar-service-typescript';
102+
import { create as createTypeScriptServicePlugin } from 'volar-service-typescript';
103+
import ts from 'typescript';
95104

96105
self.onmessage = () => {
97106
worker.initialize((ctx: monaco.worker.IWorkerContext) => {
98-
const env: ServiceEnvironment = {
99-
workspaceFolder: 'file:///',
100-
typescript: {
101-
uriToFileName: uri => uri.substring('file://'.length),
102-
fileNameToUri: fileName => 'file://' + fileName,
103-
},
107+
const env: LanguageServiceEnvironment = {
108+
workspaceFolders: [
109+
URI.parse('file:///'),
110+
],
104111
};
105112
+ env.fs = createNpmFileSystem();
106113
return createTypeScriptWorkerLanguageService({
107114
typescript: ts,
108115
compilerOptions: {
109116
// ...
110117
},
118+
uriConverter: {
119+
asFileName: uri => uri.fsPath,
120+
asUri: fileName => URI.file(fileName),
121+
},
111122
workerContext: ctx,
112123
env,
113124
languagePlugins: [
114125
// ...
115126
],
116127
languageServicePlugins: [
117128
// ...
118-
createTypeScriptService(ts),
129+
createTypeScriptServicePlugin(ts),
119130
],
120131
});
121132
});
@@ -141,14 +152,14 @@ import myWorker from './my-lang.worker?worker';
141152
### Setup Language Features and Diagnostics
142153

143154
```ts
144-
import type { LanguageService } from '@volar/language-service';
155+
import type { WorkerLanguageService } from '@volar/monaco/worker';
145156
import { editor, languages, Uri } from 'monaco-editor-core';
146157
import { activateMarkers, activateAutoInsertion, registerProviders } from '@volar/monaco';
147158

148159
languages.register({ id: 'my-lang', extensions: ['.my-lang'] });
149160

150161
languages.onLanguage('my-lang', () => {
151-
const worker = editor.createWebWorker<LanguageService>({
162+
const worker = editor.createWebWorker<WorkerLanguageService>({
152163
moduleId: 'vs/language/my-lang/myLangWorker',
153164
label: 'my-lang',
154165
});
@@ -168,7 +179,13 @@ languages.onLanguage('my-lang', () => {
168179
() => [Uri.file('/Foo.my-lang'), Uri.file('/Bar.my-lang')],
169180
editor
170181
);
171-
registerProviders(worker, ['my-lang'], languages)
182+
registerProviders(
183+
worker,
184+
['my-lang'],
185+
// sync files
186+
() => [Uri.file('/Foo.my-lang'), Uri.file('/Bar.my-lang')],
187+
languages
188+
)
172189
});
173190
```
174191

0 commit comments

Comments
 (0)