TypeError: (0 , unist_util_visit__WEBPACK_IMPORTED_MODULE_1__.visit) is not a function

[adam-magyar-instructure]

Initial checklist

• [X] I read the support docs
• [X] I read the contributing guide
• [X] I agree to follow the code of conduct
• [X] I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

9.0.1

Link to runnable example

No response

Steps to reproduce

`import React from 'react'; import { Heading, Img, Link, Text } from '@own-ui-lib'; import Markdown from 'react-markdown';

export function OwnUIMarkdown({ markdown }: { markdown: string }) { return ( <Markdown components={{ h1: ({ node, className, children, ...props }) => {children}, h2: ({ node, className, children, ...props }) => {children}, h3: ({ node, className, children, ...props }) => {children}, h4: ({ node, className, children, ...props }) => {children}, h5: ({ node, className, children, ...props }) => {children}, strong: ({ node, className, children, ...props }) => {children}, em: ({ node, className, children, ...props }) => {children}, a: ({ node, className, children, ...props }) => (

{children}

            ),
            img: ({ node, className, children, ...props }) => <Img src={props.src ?? ''} alt={props.alt} />,
            text: ({ node, className, children, ...props }) => <Text size="medium">{children}</Text>,
            p: ({ node, className, children, ...props }) => (
                <Text as="p" size="medium">
                    {children}
                </Text>
            ),
        }}>
        {markdown}
    </Markdown>
);

} `

When using the component below I got the following error in the console and it breaks our application:

Expected behavior

It should not break the application and should render the markdown.

Actual behavior

It breaks the application.

Runtime

Node v17

Package manager

npm 8

OS

macOS

Build and bundle tools

Webpack

[ChristianMurphy]

Welcome @adam-magyar-instructure! 👋 Sorry you ran into a spot of trouble.

This isn't a react-markdown bug, but a webpack one. (Example of react-markdown working fine https://stackblitz.com/github/remarkjs/.github/tree/main/sandbox-templates/react-markdown-with-vite)

Some likely root causes:

1. Using outdated webpack, it had bugs in previous major versions which have since been resolved
2. Using an incorrect webpack configuration (check the module resolution)

A helpful guide on common issues using ESM with outdated package managers https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c

[github-actions[bot]]

Hi! This was closed. Team: If this was fixed, please add phase/solved. Otherwise, please add one of the no/* labels.

[remcohaszing]

Another potential cause:

• You’re possibly using npm overrides / yarn resolutions. You should never use this unless you’re absolutely sure what you’re doing.