Monaco-editor: Critical dependency warning, hot reload not working

Created on 26 Apr 2018  路  2Comments  路  Source: microsoft/monaco-editor


monaco-editor version: 0.12.0
Browser: Chrome
OS: Windows
Steps or JS usage snippet reproducing the issue:

  1. Integrated monaco via ESM package by following the steps outlined in option 2 of: https://github.com/Microsoft/monaco-editor/blob/master/docs/integrate-esm.md
  2. After loading the browser, I see the following warning. Looks like I am also not able to hot reload in the browser as well:
[HMR] bundle has 1 warnings
client.js:189 ./node_modules/monaco-editor/esm/vs/editor/common/services/editorSimpleWorker.js
378:12-387:17 Critical dependency: the request of a dependency is an expression
 @ ./node_modules/monaco-editor/esm/vs/editor/common/services/editorSimpleWorker.js
 @ ./node_modules/monaco-editor/esm/vs/editor/editor.worker.js
*question help wanted webpack

Most helpful comment

Hi,
I also had the same issue and posted already a solutions here

new webpack.ContextReplacementPlugin(
    /monaco-editor(\\|\/)esm(\\|\/)vs(\\|\/)editor(\\|\/)common(\\|\/)services/,
    __dirname
)

Still suspecting winjs.base.js for it. 馃槫 Anyway, hope I could help!

All 2 comments

I don't know a lot about hot reloading and what could break that. I see the warning too when I execute webpack. But that is handled by creating those multiple entry points and loading works correctly for me (e.g. https://github.com/Microsoft/monaco-editor-samples/tree/master/browser-esm-webpack):

All those *.worker can be loaded at that location. Their names are dynamic because you get to choose the names.

entry: {
    "app": './index.js',
    // Package each language's worker and give these filenames in `getWorkerUrl`
    "editor.worker": 'monaco-editor/esm/vs/editor/editor.worker.js',
    "json.worker": 'monaco-editor/esm/vs/language/json/json.worker',
    "css.worker": 'monaco-editor/esm/vs/language/css/css.worker',
    "html.worker": 'monaco-editor/esm/vs/language/html/html.worker',
    "ts.worker": 'monaco-editor/esm/vs/language/typescript/ts.worker',
  },

Hi,
I also had the same issue and posted already a solutions here

new webpack.ContextReplacementPlugin(
    /monaco-editor(\\|\/)esm(\\|\/)vs(\\|\/)editor(\\|\/)common(\\|\/)services/,
    __dirname
)

Still suspecting winjs.base.js for it. 馃槫 Anyway, hope I could help!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

andreymarchenko picture andreymarchenko  路  3Comments

chengtie picture chengtie  路  3Comments

zeegin picture zeegin  路  3Comments

aarinsmith picture aarinsmith  路  3Comments

SoftTimur picture SoftTimur  路  3Comments