It report errors when i use javascript mode. But when i use xml or json, it won't report error.

[darrenfei]

monaco-editor version: 0.28.1
monaco-editor-webpack-plugin: 4.2.0
Browser: Microsoft Edge 93.0.961.52
OS: macOs Big Sur 11.3.1
Playground code that reproduces the issue:

webpack plugin:

new MonacoWebpackPlugin({
      languages:[
        'xml',
        'json',
        'javascript'
      ],
      features:['coreCommands','find']
 })

code:

import { editor } from 'monaco-editor'

const codeString = 'console.log('code')'
editor.create(
      document.getElementById('editor'), 
      {
        value: codeString,
        theme: 'vs-dark',
        language: 'javascript',
        fontSize: 14,
        tabSize: 2,
        wordWrap: 'on'
      }
)

Error message below:

Could not create web worker(s). Falling back to loading web worker code in main thread, which might cause UI freezes. Please see https://github.com/microsoft/monaco-editor#faq
Unexpected token '<'
Unexpected usage
    at EditorSimpleWorker.loadForeignModule (editorSimpleWorker.js:450)
    at webWorker.js:38

[sentrychris]

I had a similar issue that was caused by not defining the location of my worker scripts. See https://github.com/microsoft/monaco-editor/blob/main/docs/integrate-esm.md for details on how to resolve.

[darrenfei]

I had a similar issue that was caused by not defining the location of my worker scripts. See https://github.com/microsoft/monaco-editor/blob/main/docs/integrate-esm.md for details on how to resolve.

I tried, but failed.

[alexdima]

@darrenfei This looks like a problem with webpack. Could you please start with a sample like https://github.com/microsoft/monaco-editor-samples/tree/main/browser-esm-webpack-monaco-plugin and check if that works for you? Then you can try tweaking the webpack versions to be the same ones you have and check if things still work, then finally you can try to bring over the webpack config into your application's webpack config.

[darrenfei]

@darrenfei This looks like a problem with webpack. Could you please start with a sample like https://github.com/microsoft/monaco-editor-samples/tree/main/browser-esm-webpack-monaco-plugin and check if that works for you? Then you can try tweaking the webpack versions to be the same ones you have and check if things still work, then finally you can try to bring over the webpack config into your application's webpack config.

I created a new react app with create-react-app & react-app-rewired. It still not working.
Here is the config:

[fantasy525]

I solved it，in fact,if you use javascript,u can set
config .plugin('monaco-editor-webpack-plugin') .use(monacoEditorPlugin, [{ languages: ['typescript'] }]);
and the default language for monaco-editor is typescript ,html,json,css

and I change languages:['javascript'] to languages:['typesccript'],then OK