diff --git a/electron-esm-webpack/.gitignore b/electron-esm-webpack/.gitignore
new file mode 100644
index 00000000..7ef6094d
--- /dev/null
+++ b/electron-esm-webpack/.gitignore
@@ -0,0 +1,2 @@
+/dist/*.js
+/dist/*.ttf
diff --git a/electron-esm-webpack/dist/electron-index.html b/electron-esm-webpack/dist/electron-index.html
new file mode 100644
index 00000000..f7dfa113
--- /dev/null
+++ b/electron-esm-webpack/dist/electron-index.html
@@ -0,0 +1,27 @@
+
+
+
+
+
+ Monaco Editor!
+
+
+
+
+ Monaco Editor in Electron (without nodeIntegration)!
+ Note: Since Electron without nodeIntegration is very similar to a browser, you can have a look
+ at all the other `browser-` samples, as they should work just fine.
+
+
+
+
+
diff --git a/electron-esm-webpack/index.js b/electron-esm-webpack/index.js
new file mode 100644
index 00000000..8b444a2b
--- /dev/null
+++ b/electron-esm-webpack/index.js
@@ -0,0 +1,24 @@
+import * as monaco from 'monaco-editor';
+
+self.MonacoEnvironment = {
+ getWorkerUrl: function (moduleId, label) {
+ if (label === 'json') {
+ return './json.worker.bundle.js';
+ }
+ if (label === 'css' || label === 'scss' || label === 'less') {
+ return './css.worker.bundle.js';
+ }
+ if (label === 'html' || label === 'handlebars' || label === 'razor') {
+ return './html.worker.bundle.js';
+ }
+ if (label === 'typescript' || label === 'javascript') {
+ return './ts.worker.bundle.js';
+ }
+ return './editor.worker.bundle.js';
+ }
+};
+
+monaco.editor.create(document.getElementById('container'), {
+ value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'),
+ language: 'javascript'
+});
diff --git a/electron-esm-webpack/main.js b/electron-esm-webpack/main.js
new file mode 100644
index 00000000..1d9e0d5c
--- /dev/null
+++ b/electron-esm-webpack/main.js
@@ -0,0 +1,32 @@
+const electron = require('electron');
+const app = electron.app;
+const BrowserWindow = electron.BrowserWindow;
+
+let mainWindow;
+
+function createWindow() {
+ mainWindow = new BrowserWindow({
+ width: 800,
+ height: 600,
+ webPreferences: { worldSafeExecuteJavaScript: true }
+ });
+ mainWindow.loadURL(`file://${__dirname}/dist/electron-index.html`);
+ mainWindow.webContents.openDevTools();
+ mainWindow.on('closed', function () {
+ mainWindow = null;
+ });
+}
+
+app.on('ready', createWindow);
+
+app.on('window-all-closed', function () {
+ if (process.platform !== 'darwin') {
+ app.quit();
+ }
+});
+
+app.on('activate', function () {
+ if (mainWindow === null) {
+ createWindow();
+ }
+});
diff --git a/electron-esm-webpack/package.json b/electron-esm-webpack/package.json
new file mode 100644
index 00000000..0c0afb91
--- /dev/null
+++ b/electron-esm-webpack/package.json
@@ -0,0 +1,8 @@
+{
+ "name": "electron-esm-webpack",
+ "main": "./main",
+ "scripts": {
+ "build": "node ../node_modules/webpack/bin/webpack.js --progress",
+ "execute": "node ../node_modules/electron/cli.js ."
+ }
+}
diff --git a/electron-esm-webpack/webpack.config.js b/electron-esm-webpack/webpack.config.js
new file mode 100644
index 00000000..1685f61b
--- /dev/null
+++ b/electron-esm-webpack/webpack.config.js
@@ -0,0 +1,29 @@
+const path = require('path');
+
+module.exports = {
+ entry: {
+ app: './index.js',
+ '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'
+ },
+ output: {
+ globalObject: 'self',
+ filename: '[name].bundle.js',
+ path: path.resolve(__dirname, 'dist')
+ },
+ module: {
+ rules: [
+ {
+ test: /\.css$/,
+ use: ['style-loader', 'css-loader']
+ },
+ {
+ test: /\.ttf$/,
+ use: ['file-loader']
+ }
+ ]
+ }
+};