Could not load worker TypeError: Cannot read property 'split' of undefined

[khanh-nguyen]

I'm using brace@0.11.1 with webpack@3.6.x. (The problem occured in both Firefox and Chrome on Mac OS X Sierra.)

This is how I set it up

const ace = require('brace');
require('brace/theme/monokai');
require('brace/mode/json');

//...
const editor = ace.edit(elementId);
editor.setTheme('ace/theme/monokai');
editor.session.setMode('ace/mode/json');

While theme is loaded correctly, I got the following error when setting mode

Could not load worker TypeError: Cannot read property 'split' of undefined
    at AppConfig.exports.moduleUrl (index.js:4113)
    at new WorkerClient (index.js:18003)
    at Mode.createWorker (json.js:300)
    at EditSession.$startWorker (index.js:10226)
    at EditSession.$onChangeMode (index.js:10182)
    at EditSession.<anonymous> (index.js:10163)
    at AppConfig.exports.loadModule (index.js:4151)
    at EditSession.setMode (index.js:10152)

Apperantly, name here is undefined.

As the result, syntax check is not working in the editor.

[khanh-nguyen]

I solved this by requiring the worker.

[omspacecode]

Faced similar issue, for quick fix to avoid displaying that warning added a try catch block and closed it.

[sharq88]

Faced similar issue on a rollup/vue/brace/vue2-ace-editor combo site. Probably doesn't affect many people but in case someone also goes trough the same: Tried to replace brace to ace because brace is now over two years old and needed some updates for async/await. The error was due to the mixed use of the two packages which rollup could not handle too well. Once I eliminated all references to brace the issue gone away. Also used this for the editor:

import * as ace from 'ace-builds'; // for rollup to work
ace.config.set('basePath', '/js/vendor/ace'); // for the mods/themes ...etc to load from the public directory of the webserver