react-textarea-code-editor
                                
                                 react-textarea-code-editor copied to clipboard
                                
                                    react-textarea-code-editor copied to clipboard
                            
                            
                            
                        Can't use this library with Next.js using a `next.config.mjs` file
I'm trying to use this with a next.config.mjs file and am probably using this incorrectly. The issue I'm running into is that there is no place for me to pass my existing NextConfig as an argument into removeImports, since the signature looks like:
declare type PluginOptions = {
    test?: RegExp;
    matchImports?: string;
};
declare const _default: (pluginOptions?: PluginOptions) => (nextConfig?: NextConfig) => NextConfig;
I've tried instead to merge the output from removeImports with my initialized config, but that didn't seem to have any effect:
// @ts-check
import removeImports from 'next-remove-imports'
/**
 * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation.
 * This is especially useful for Docker builds.
 */
!process.env.SKIP_ENV_VALIDATION && (await import("./src/env.mjs"));
/** @type {import("next").NextConfig} */
const config = {
  reactStrictMode: true,
  /**
   * If you have the "experimental: { appDir: true }" setting enabled, then you
   * must comment the below `i18n` config out.
   *
   * @see https://github.com/vercel/next.js/issues/41980
   */
  i18n: {
    locales: ["en"],
    defaultLocale: "en",
  },
	...removeImports(),
};
export default config;
This must be the case of me doing something incorrectly, but it's blocking my ability to use this package.
I've created an issue for this in next-remove-imports.
@RobotSail
- https://github.com/uiwjs/next-remove-imports/issues/8#issuecomment-1437724960
@RobotSail
import removeImports from 'next-remove-imports'
const removeImportsFun = removeImports({
  options: { },
})
export default removeImportsFun({
  reactStrictMode: true,
  i18n: {
    locales: ["en"],
    defaultLocale: "en",
  },
})
@jaywcjlove Thanks! I tried using CodeEditor with the above configuration but am still running into the following error:
Error: require() of ES Module /Users/osilkin/Programming/main/autoreviewer-2/node_modules/rehype/index.js from /Users/osilkin/Programming/main/autoreviewer-2/node_modules/@uiw/react-textarea-code-editor/cjs/utils.js not supported.
Instead change the require of index.js in /Users/osilkin/Programming/main/autoreviewer-2/node_modules/@uiw/react-textarea-code-editor/cjs/utils.js to a dynamic import() which is available in all CommonJS modules.
@RobotSail
- https://github.com/uiwjs/react-md-editor/issues/446#issue-1417594634
In case of Next.js, adding experimental.esmExternals: 'loose' fixes the issue.