CODEWITHSUNDEEP
node.jsreactjslanguage-server-protocoldocusaurus
Rami ZK
Rami ZK

Reputation: 560

Error importing 'vscode-languageserver' in a React app

I am trying to create a playground using monaco-editor and vscode-languageserver to show the features of my language server.

However when I try to import 'vscode-languageserver' from a page like the following example 

//# src/pages/test.js 
const { TextDocument } =  require("vscode-languageserver"); 
console.log(TextDocument.create('a' , 'b' , 'c' , 'd' ));

https://github.com/zkrami/docusaurus-test/blob/master/src/pages/test.js

I get the following errors: 

Module not found: Can't resolve 'child_process' in 'C:\Users\Rami\git\my-website\node_modules\vscode-languageserver\lib'./node_modules/vscode-languageserver/lib/files.js

Module not found: Can't resolve 'fs' in 'C:\Users\Rami\git\my-website\node_modules\vscode-languageserver\lib'./node_modules/vscode-jsonrpc/lib/pipeSupport.js

and please note that if I imported the module in the docusaurus.config.js file it works perfectly.

I made a quick example you can try: https://github.com/zkrami/docusaurus-test/

Specifications: 

yarn 1.22.4 
node v10.15.3
OS: Windows
@docusaurus/core: "^2.0.0-alpha.54"

Upvotes: 2

Views: 574

Answers (2)

Rami ZK
Rami ZK

Reputation: 560

I ended up using vscode-languageserver-protocol package which fulfill my requirements.

Upvotes: 1

Yangshun Tay
Yangshun Tay

Reputation: 53169

fs is a Node module and requires Node runtime, you can't use it in the browser.

This is not a Docusaurus issue, you wouldn't be able to use it in any client-side React app.

Upvotes: 0

Related Questions