Code Monkey home page Code Monkey logo

monaco-tm's Introduction

monaco-tm

This gets TextMate grammars working in standalone Monaco by leveraging vscode-oniguruma and vscode-textmate. For more context, see: microsoft/monaco-editor#1915.

Run demo

Currently, only the Python grammar and VS Code Dark+ themes are included in the demo.

monaco-tm's People

Contributors

bolinfest avatar dependabot[bot] avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar avatar

Forkers

zuiidea pocket-titan ohtuprojekti-eficode 93akkord thebaselab vivek1729 intei-cloud gxreqort neodon clintonkildepstein techwithanirudh cloa-io snooz82 summercms kamic6238 c7o8 agp12327 suryatmodulus bladerunner18 scottpeterman souporserious longervisioncanada kila2 jazzpirate eddyzhang1986 ahmedsamyeg jingtian0721

monaco-tm's Issues

Error: error:0308010C:digital envelope routines::unsupported

I'm trying to run the demo under Ubuntu 22.04, with npm:

``console
➜ monaco-tm git:(main) npm --version
9.7.1


But got the following **ERROR** messages:

```console
➜  monaco-tm git:(main) yarn demo
yarn run v1.22.19
warning ../../../package.json: No license field
$ webpack-dev-server --config webpack.config.cjs --port 8084
ℹ ｢wds｣: Project is running at http://localhost:8084/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: Content not from webpack is served from ....../monaco-tm
node:internal/crypto/hash:71
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (....../monaco-tm/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (....../monaco-tm/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (....../monaco-tm/node_modules/webpack/lib/NormalModule.js:471:10)
    at ....../monaco-tm/node_modules/webpack/lib/NormalModule.js:503:5
    at ....../monaco-tm/node_modules/webpack/lib/NormalModule.js:358:12
    at ....../monaco-tm/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (....../monaco-tm/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at Array.<anonymous> (....../monaco-tm/node_modules/loader-runner/lib/LoaderRunner.js:205:4) {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v18.16.1
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Failed to launch demo on Windows

Failed to launch demo on windows, but succeed to launch on Ubuntu WSL.

Step to reproduce:

  1. clone this repo to a Windows PC.
  2. yarn install
  3. yarn demo
  4. notice the demo won't launch
  5. open this directory in a Ubuntu WSL and launch it, notice it launchs.

Log in windows:

PS C:\Users\lxyan\programs\vscode-ext\monaco-tm> yarn install
yarn install v1.22.19
[1/4] Resolving packages...
success Already up-to-date.
Done in 0.49s.
PS C:\Users\lxyan\programs\vscode-ext\monaco-tm> yarn demo   
yarn run v1.22.19
$ webpack-dev-server --config webpack.config.cjs --port 8084
i ｢wds｣: Project is running at http://localhost:8084/
i ｢wds｣: webpack output is served from /
i ｢wds｣: Content not from webpack is served from C:\Users\lxyan\programs\vscode-ext\monaco-tm
node:internal/crypto/hash:71
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:140:10)
    at module.exports (C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\webpack\lib\util\createHash.js:135:53)
    at NormalModule._initBuildHash (C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\webpack\lib\NormalModule.js:417:16)
    at handleParseError (C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\webpack\lib\NormalModule.js:471:10)
    at C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\webpack\lib\NormalModule.js:503:5
    at C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\webpack\lib\NormalModule.js:358:12
    at C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\loader-runner\lib\LoaderRunner.js:373:3
    at iterateNormalLoaders (C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
    at Array.<anonymous> (C:\Users\lxyan\programs\vscode-ext\monaco-tm\node_modules\loader-runner\lib\LoaderRunner.js:205:4) {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v19.1.0
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
PS C:\Users\lxyan\programs\vscode-ext\monaco-tm>

onEnterRules in language configuration seems to break editor

When a language configuration file contains onEnterRules, the editor seems to choke on them any time the [Enter] key is pressed. I get an error each time says Uncaught Error: e.reg.test is not a function, which sounds like it's attempting to apply the rules but it's not recognizing them as a proper Regular Expression.

The only way I've found to fix this is to delete the onEnterRules. Are these rules explicitly unsupported, or is there something I can do to get them working? It looks like Monaco supports them by default, but perhaps they weren't implemented here when the textMate grammar support was added.

Developer: Inspect Tokens menu won't load

When using this approach, the command for Developer: Inspect Tokens turns up this error.

errors.js:22 Uncaught Error: Not supported!

Error: Not supported!
    at EncodedTokenizationSupport2Adapter.tokenize (standaloneLanguages.js:110)
    at InspectTokensWidget._getStateBeforeLine (inspectTokens.js:269)
    at InspectTokensWidget._getTokensAtLine (inspectTokens.js:256)
    at InspectTokensWidget._compute (inspectTokens.js:174)
    at new InspectTokensWidget (inspectTokens.js:161)
    at InspectTokensController.launch (inspectTokens.js:79)
    at InspectTokens.run (inspectTokens.js:107)
    at InspectTokens.EditorAction.runEditorCommand (editorExtensions.js:204)
    at eval (codeEditorWidget.js:247)
    at InstantiationService.invokeFunction (instantiationService.js:84)
    at eval (errors.js:22)
eval @ errors.js:22
setTimeout (async)
ErrorHandler.unexpectedErrorHandler @ errors.js:20
ErrorHandler.onUnexpectedError @ errors.js:34
onUnexpectedError @ errors.js:48
eval @ quickCommand.js:76
setTimeout (async)
EditorActionCommandEntry.run @ quickCommand.js:68
QuickOpenModel.run @ quickOpenModel.js:423
QuickOpenWidget.elementSelected @ quickOpenWidget.js:431
eval @ quickOpenWidget.js:168

Do you know how to get around this?

Critical dependency: the request of a dependency is an expression

When using webpack for this project, I got the following warning:

WARNING in ./node_modules/vscode-textmate/release/main.js 23:15-27
Critical dependency: the request of a dependency is an expression
 @ ./src/providers.ts
 @ ./src/app.ts
 @ multi ./src/app.ts

Looks like some dynamically linked modules can not be statically determined by webpack. I checked the vscode-textmate code:

function $load(name, factory) {
    var mod = {
        exports: {}
    };
    var requireFunc = function (mod) {
        if ($map[mod]) {
            return $map[mod].exports;
        }
        return require(mod);
    };
    factory.call(this, requireFunc, mod, mod.exports);
    $map[name] = mod;
}

Looks like the require(mod) caused the problem.

Is it safe to just dismiss the warning or is there anything we need to do about it?

TypeError when using certain Monaco Editor commands or specific languages

First problem:
Run monaco.editor.getModel() in Javascript Console. The following error pops up. I can reproduce this on both Chrome and Safari on macOS 11.

Uncaught TypeError: Cannot read property 'toString' of undefined 
at MODEL_ID (webpack:///./node_modules/monaco-editor/esm/vs/editor/common/services/modelServiceImpl.js?:55:21) 
at ModelServiceImpl.getModel (webpack:///./node_modules/monaco-editor/esm/vs/editor/common/services/modelServiceImpl.js?:333:25)
at Object.getModel (webpack:///./node_modules/monaco-editor/esm/vs/editor/standalone/browser/standaloneEditor.js?:185:102) 
at <anonymous>:1:15

Second problem:
When using most TextMate grammars other than Python (extracted from VS Code extensions), for example Java, Rust, Bat and SQL, the Javascript console produces the following error:

errors.js:22 Uncaught Error: Cannot read property 'charAt' of undefined

TypeError: Cannot read property 'charAt' of undefined
    at new CursorConfiguration (cursorCommon.js:73)
    at eval (viewModelImpl.js:309)
    at Emitter.fire (event.js:454)
    at eval (textModel.js:178)
    at Emitter.fire (event.js:454)
    at LanguageConfigurationRegistryImpl.register (languageConfigurationRegistry.js:120)
    at Object.setLanguageConfiguration (standaloneLanguages.js:98)
    at eval (register.ts:24)
    at eval (errors.js:22)

Although the code loads normally for the first time, the editor produces the same error and display a blank page when I load another model. I cannot reproduce this when using HTML, Javascript, or Python grammars.

`yarn demo` brought me so many ERROR messages ... 

➜  monaco-tm git:(main) ✗ yarn demo
yarn run v1.22.19
warning ../../../package.json: No license field
$ webpack-dev-server --config webpack.config.cjs --port 8084
ℹ ｢wds｣: Project is running at http://localhost:8084/
ℹ ｢wds｣: webpack output is served from /
ℹ ｢wds｣: Content not from webpack is served from ....../monaco-tm
✖ ｢wdm｣: assets by path *.js 25.2 MiB
  asset ts.worker.bundle.js 10.9 MiB [emitted] (name: ts.worker)
  asset app.bundle.js 7.66 MiB [emitted] (name: app)
  asset css.worker.bundle.js 2.41 MiB [emitted] (name: css.worker)
  asset html.worker.bundle.js 1.71 MiB [emitted] (name: html.worker)
  asset json.worker.bundle.js 1.24 MiB [emitted] (name: json.worker)
  asset editor.worker.bundle.js 843 KiB [emitted] (name: editor.worker)
  asset editor.worker.js 447 KiB [emitted]
assets by path *.ttf 59.7 KiB
  asset b3726f0165bf67ac68494ee7a1b9f6ce.ttf 59.6 KiB [emitted] (auxiliary name: app)
  asset 932f67b02cb3212e2768.ttf 80 bytes [emitted] [immutable] [from: node_modules/monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon.ttf] (auxiliary name: app)
runtime modules 7.89 KiB 35 modules
modules by path ./node_modules/monaco-editor/esm/vs/ 17.7 MiB (javascript) 80 bytes (asset) 749 modules
modules by path ./node_modules/webpack-dev-server/ 21.2 KiB 12 modules
modules by path ./node_modules/url/ 49.1 KiB 6 modules
modules by path ./src/*.ts 29.8 KiB 5 modules
modules by path ./node_modules/html-entities/lib/*.js 61 KiB 5 modules
modules by path ./node_modules/webpack/hot/ 2.1 KiB 3 modules
modules by path ./node_modules/css-loader/dist/runtime/*.js 2.89 KiB 3 modules
modules by mime type image/png 833 bytes 3 modules
modules by path ./node_modules/vscode-textmate/release/ 148 KiB 2 modules
modules by mime type image/svg+xml 3.17 KiB 2 modules
modules by path ./node_modules/call-bind/*.js 1.68 KiB 2 modules
modules by path ./node_modules/has-symbols/*.js 2.13 KiB 2 modules
modules by path ./node_modules/function-bind/*.js 1.55 KiB 2 modules
+ 13 modules

WARNING in ./node_modules/vscode-textmate/release/main.js 23:15-27
Critical dependency: the request of a dependency is an expression
 @ ./src/providers.ts 1:0-69 18:28-36 29:23-38 99:23-30
 @ ./src/app.ts 13:0-57 85:25-51

1 warning has detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
914:33-36
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(914,34)
      TS1005: '?' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
915:16-17
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(915,17)
      TS1005: ':' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
916:16-17
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(916,17)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
919:33-36
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(919,34)
      TS1005: '?' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
920:16-17
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(920,17)
      TS1005: ':' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
921:16-17
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(921,17)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
921:25-26
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(921,26)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
922:4-5
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(922,5)
      TS1109: Expression expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
926:23-24
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(926,24)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
930:34-35
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(930,35)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
936:38-39
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(936,39)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
940:20-21
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(940,21)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
945:18-25
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(945,19)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
945:26-34
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(945,27)
      TS1005: ':' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
945:35-38
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(945,36)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
945:54-56
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(945,55)
      TS1005: '{' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
945:63-64
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(945,64)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
945:76-77
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(945,77)
      TS1005: ',' expected.

ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts
949:21-22
[tsl] ERROR in ....../monaco-tm/node_modules/@types/node/ts4.8/test.d.ts(949,22)
      TS1005: ',' expected.

19 errors have detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.

webpack 5.88.0 compiled with 19 errors and 1 warning in 4740 ms
ℹ ｢wdm｣: Failed to compile.

Can anyboby give me a hand? Look like a TypeScript issue...

Grammar injections?

Any idea how I'd accomplish injecting a TextMate grammar into an existing Monarch grammar (as indicated here: https://code.visualstudio.com/api/language-extensions/syntax-highlight-guide#injection-grammars)?

Basically, I'm trying to bring vscode-styled-components's functionality over to Monaco, and I'm at a loss for how to do it. I've studied the code responsible for registering extension grammar contributions, as well as the code for tokenization, and I just can't quite figure out how it all connects.

Thanks!

CodeLens / Intellisense?

The monaco HTML/CSS/JavaScript packages include CodeLens/Intellisense, but loading the grammars with this method doesn't have that data. I assume something like https://github.com/microsoft/vscode/blob/master/extensions/css-language-features/ needs to be loaded, but is that even possible in Monaco at this point?

Just wondering if you have any guidance since you dove so deep into the grammar setup. I suspect I'll need to break down how the languageFeatures work in the monaco packages. https://github.com/microsoft/monaco-html/blob/master/src/languageFeatures.ts

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.