Search code examples
javascriptjsxmonaco-editor

monaco editor - "[ts] Unterminated regular expression literal"


TS compiler does not recognise jsx tags, and fails parsing them.

This only happens when I set the language to be 'typescript'
(and there is no built in language for 'typescriptReact' :(

enter image description here
How to configure monaco so it will accept jsx?

I tried:

monaco.languages.typescript.typescriptDefaults.setCompilerOptions(options)
I went through all of the options but none seem to work. (especially the jsx: 'react' option.

monaco.languages.typescript.typescriptDefaults.setDiagnosticsOptions({})
{ noSyntaxValidation: true})
works, but removes all validations from TS. :S

finally I made sure that the language is set to 'typescript':
monaco.editor.createModel("const a = <div></div>", "typescript", undefined)
(yes, I also tried the filepath)


Solution

  • tl;dr - yes, the file needs to be '.tsx'.

    I had a single instance of Editor Model, with undefined filename.
    The correct way to set filename is using Uri.file(filepath) as path,
    and these errors are gone for .tsx (but not for .ts files).


    as a bonus, I get to keep undo history, as long as I reuse existing models.

    so yay!