monaco-editor使用

npm i react-monaco-editor monaco-editor

npm i monaco-editor-webpack-plugin -D

    new MonacoWebpackPlugin({
      // available options are documented at https://github.com/microsoft/monaco-editor/blob/main/webpack-plugin/README.md#options
      languages: ['shell', 'json', 'xml', 'yaml', 'sql', 'dockerfile', 'bat', 'ini', 'markdown', 'javascript'],
      filename: '/monaco-editor/[name].worker.[contenthash].js',
      publicPath: '',
      features: ['coreCommands'],
      globalAPI: false,
    }),

output:{  
    chunkFilename: ({ chunk }) => {
        const regex = /((?<=esm_)vs_(basic-languages|language)_.+)/;
        const language = chunk.id.match(regex);
        return language ? `vendor/monaco-${language[1]}.[chunkhash].js` : 'vendor/[name].[chunkhash].js';
      },
        },
  ...      
        
     optimization: {
      chunkIds: 'named',       
        ...
     }