Add globalAPI option to expose the editor API through a global monaco object

README.md

@@ -71,6 +71,9 @@ Options can be passed in to `MonacoWebpackPlugin`. They can be used to generate
   * default value: <!-- FEATURES_BEGIN -->`['accessibilityHelp', 'anchorSelect', 'bracketMatching', 'caretOperations', 'clipboard', 'codeAction', 'codelens', 'colorPicker', 'comment', 'contextmenu', 'coreCommands', 'cursorUndo', 'dnd', 'documentSymbols', 'find', 'folding', 'fontZoom', 'format', 'gotoError', 'gotoLine', 'gotoSymbol', 'hover', 'iPadShowKeyboard', 'inPlaceReplace', 'indentation', 'inlineHints', 'inspectTokens', 'linesOperations', 'linkedEditing', 'links', 'multicursor', 'parameterHints', 'quickCommand', 'quickHelp', 'quickOutline', 'referenceSearch', 'rename', 'smartSelect', 'snippets', 'suggest', 'toggleHighContrast', 'toggleTabFocusMode', 'transpose', 'unusualLineTerminators', 'viewportSemanticTokens', 'wordHighlighter', 'wordOperations', 'wordPartOperations']`<!-- FEATURES_END -->.
   * excluded features: It is also possible to exclude certain default features prefixing them with an exclamation mark '!'.
 
+* `globalAPI` (`boolean`) - specify whether the editor API should be exposed through a global `monaco` object or not. This option is applicable to `0.22.0` and newer version of `monaco-editor`. Since `0.22.0`, the ESM version of the monaco editor does no longer define a global `monaco` object unless `global.MonacoEnvironment = { globalAPI: true }` is set ([change log](https://github.com/microsoft/monaco-editor/blob/main/CHANGELOG.md#0220-29012021)).
+  * default value: `false`.
+
 ## Version Matrix
 
 | `monaco-editor-webpack-plugin` | `monaco-editor` |

src/index.ts

@@ -99,6 +99,15 @@ interface IMonacoEditorWebpackPluginOpts {
    * Use e.g. '/' if you want to load your resources from the current origin.
    */
   publicPath?: string;
+
+  /**
+   * Specify whether the editor API should be exposed through a global `monaco` object or not. This
+   * option is applicable to `0.22.0` and newer version of `monaco-editor`. Since `0.22.0`, the ESM
+   * version of the monaco editor does no longer define a global `monaco` object unless
+   * `global.MonacoEnvironment = { globalAPI: true }` is set ([change
+   * log](https://github.com/microsoft/monaco-editor/blob/main/CHANGELOG.md#0220-29012021)).
+   */
+  globalAPI?: boolean;
 }
 
 interface IInternalMonacoEditorWebpackPluginOpts {
@@ -106,6 +115,7 @@ interface IInternalMonacoEditorWebpackPluginOpts {
   features: IFeatureDefinition[];
   filename: string;
   publicPath: string;
+  globalAPI: boolean;
 }
 
 class MonacoEditorWebpackPlugin implements webpack.WebpackPluginInstance {
@@ -121,11 +131,12 @@ class MonacoEditorWebpackPlugin implements webpack.WebpackPluginInstance {
       features: coalesce(features.map(id => featuresById[id])),
       filename: options.filename || "[name].worker.js",
       publicPath: options.publicPath || '',
+      globalAPI: options.globalAPI || false,
     };
   }
 
   apply(compiler: webpack.Compiler): void {
-    const { languages, features, filename, publicPath } = this.options;
+    const { languages, features, filename, publicPath, globalAPI } = this.options;
     const compilationPublicPath = getCompilationPublicPath(compiler);
     const modules = [EDITOR_MODULE].concat(languages).concat(features);
     const workers: ILabeledWorkerDefinition[] = [];
@@ -138,7 +149,7 @@ class MonacoEditorWebpackPlugin implements webpack.WebpackPluginInstance {
         });
       }
     });
-    const rules = createLoaderRules(languages, features, workers, filename, publicPath, compilationPublicPath);
+    const rules = createLoaderRules(languages, features, workers, filename, publicPath, compilationPublicPath, globalAPI);
     const plugins = createPlugins(workers, filename);
     addCompilerRules(compiler, rules);
     addCompilerPlugins(compiler, plugins);
@@ -176,7 +187,7 @@ function getCompilationPublicPath(compiler: webpack.Compiler): string {
   return '';
 }
 
-function createLoaderRules(languages: IFeatureDefinition[], features: IFeatureDefinition[], workers: ILabeledWorkerDefinition[], filename: string, pluginPublicPath: string, compilationPublicPath: string): webpack.RuleSetRule[] {
+function createLoaderRules(languages: IFeatureDefinition[], features: IFeatureDefinition[], workers: ILabeledWorkerDefinition[], filename: string, pluginPublicPath: string, compilationPublicPath: string, globalAPI: boolean): webpack.RuleSetRule[] {
   if (!languages.length && !features.length) {
     return [];
   }
@@ -215,6 +226,7 @@ function createLoaderRules(languages: IFeatureDefinition[], features: IFeatureDe
         return str.replace(/\\/$/, '');
       }
       return {
+        globalAPI: ${globalAPI},
         getWorkerUrl: function (moduleId, label) {
           var pathPrefix = ${pathPrefix};
           var result = (pathPrefix ? stripTrailingSlash(pathPrefix) + '/' : '') + paths[label];