How to use monaco-editor-webpack-plugin - 3 common examples

export default (conf) => {
  const pkg = require(path.resolve(process.cwd(), 'package.json'));
  conf.plugins.push(new MonacoWebpackPlugin({
    // languages: ['bat', 'coffee', 'cpp', 'csharp', 'csp', 'css', 'dockerfile', 'fsharp', 'go', 'handlebars', 'html', 'ini', 'java', 'json', 'less', 'lua', 'markdown', 'msdax', 'mysql', 'objective', 'pgsql', 'php', 'postiats', 'powershell', 'pug', 'python', 'r', 'razor', 'redis', 'redshift', 'ruby', 'sb', 'scss', 'solidity', 'sql', 'swift', 'typescript', 'vb', 'xml', 'yaml'],
    // features: ['accessibilityHelp', 'bracketMatching', 'caretOperations', 'clipboard', 'codelens', 'colorDetector', 'comment', 'contextmenu', 'coreCommands', 'cursorUndo', 'dnd', 'find', 'folding', 'format', 'gotoDeclarationCommands', 'gotoDeclarationMouse', 'gotoError', 'gotoLine', 'hover', 'inPlaceReplace', 'inspectTokens', 'iPadShowKeyboard', 'linesOperations', 'links', 'multicursor', 'parameterHints', 'quickCommand', 'quickFixCommands', 'quickOutline', 'referenceSearch', 'rename', 'smartSelect', 'snippets', 'suggest', 'toggleHighContrast', 'toggleTabFocusMode', 'transpose', 'wordHighlighter', 'wordOperations'],
  }));
  // conf.resolve = conf.resolve || {};
  conf.resolve.alias = { '@uiw/react-monacoeditor': process.cwd() };

  // Loader Markdown
  conf.module.rules.map((item) => {
    if (item.oneOf) {
      item.oneOf.unshift({
        test: /\.md$/,
        use: require.resolve('raw-loader'),
      });
    }
    return item;
  });

const { languagesArr } = require('monaco-editor-webpack-plugin/out/languages');

// monaco-yaml library doesn't play so well with monaco-editor-webpack-plugin
// so the only way to include its workers is by patching the list of languages
// in monaco-editor-webpack-plugin and adding support for yaml workers. This is
// a known issue in the library and this workaround was suggested here:
// https://github.com/pengx17/monaco-yaml/issues/20

const yamlLang = languagesArr.find((t) => t.label === 'yaml');

yamlLang.entry = [yamlLang.entry, '../../monaco-yaml/lib/esm/monaco.contribution'];
yamlLang.worker = {
  id: 'vs/language/yaml/yamlWorker',
  entry: '../../monaco-yaml/lib/esm/yaml.worker.js',
};

module.exports = require('monaco-editor-webpack-plugin');