Microsoft/monaco-editor

Unable to load web workers in Electron app with Webpack

Open

#2,087 opened on Aug 20, 2020

View on GitHub
 (2 comments) (0 reactions) (0 assignees)JavaScript (14,836 stars) (1,283 forks)batch import
bughelp wantedintegrationwebpack-plugin

Description

monaco-editor version: 0.20.0 Browser: Electron 8 (chromium) OS: MacOS 10.15.6 Repo with reproducible issue: https://github.com/alanqthomas/electron-webpack-monaco-test

I've created a basic Electron app using the boilerplate from. https://github.com/electron-react-boilerplate/electron-react-boilerplate

I also added a custom language implementation, basically just copy/pasting the relevant bits from https://github.com/amazzalel-habib/TodoLangEditor.

I get the following errors when monaco tries to load the web worker: Screen Shot 2020-08-20 at 1 41 42 PM

I've searched far and wide on github and stack overflow for solutions but I can't seem to find anything that works. I have a feeling this might have more to do with webpack/the build, but I'm not sure if that's an issue with my configuration or a limitation of monaco editor.

Please see the linked repo to reproduce the issue. It can be run with yarn install followed by yarn dev. The relevant webpack config is in configs/webpack.config.renderer.dev.babel.js.

Any pointers in the right direction would be much appreciated.

Contributor guide

Tech stack
javascripttypescript
Domain
desktopfrontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
4
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
over 1 week
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
needs investigation
Prerequisites
Webpack configurationMonaco Editor basicsWeb WorkersElectron
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
15
Research direction
Review the webpack configuration at configs/webpack.config.renderer.dev.babel.js and the Monaco Editor worker setup in src/... Investigate how workers are loaded and whether the Electron environment requires a different approach. Check for similar issues or pull requests in the repository for guidance.