Import path using `src` in TypeScript file

[yordis]

Hey, it seems that I must include src in the import path:

import rehypeExtractTocMdx from '@stefanprobst/rehype-extract-toc/src/mdx';

Instead of

import rehypeExtractTocMdx from '@stefanprobst/rehype-extract-toc/mdx';

Which produces the following issue:

Module not found: Package path ./src/mdx is not exported from package website/node_modules/@stefanprobst/rehype-extract-toc (see exports field in website/node_modules/@stefanprobst/rehype-extract-toc/package.json)

[stefanprobst]

hmm, the following is working for me:

// pages/index,js
import withSlugs from "rehype-slug";
import withToc from "@stefanprobst/rehype-extract-toc";
import withTocExport from "@stefanprobst/rehype-extract-toc/mdx";
import { compile } from "xdm";

const doc = `
# Heading 1

## Heading 1.1
`;

export async function getStaticProps() {
  const file = await compile(doc, {
    rehypePlugins: [withSlugs, withToc, withTocExport],
  });
  const { toc } = file.data;
  return { props: { toc } };
}

export default function HomePage(props) {
  return <pre>{JSON.stringify(props.toc, null, 2)}</pre>;
}

{
  "dependencies": {
    "next": "12.0.3",
    "react": "17.0.2",
    "react-dom": "17.0.2"
  },
  "devDependencies": {
    "@stefanprobst/rehype-extract-toc": "^2.1.1",
    "rehype-slug": "^5.0.0",
    "xdm": "^3.2.0"
  }
}

[yordis]

@stefanprobst would you mind renaming the file to .ts? then it will be a read-importing

[stefanprobst]

would you mind renaming the file to .ts

do you mean in the code snippet above?

[yordis]

If you convert the file to be a TypeScript file, then we have to do @ts-ignore

// @ts-ignore
import rehypeExtractTocMdx from '@stefanprobst/rehype-extract-toc/mdx';

P.S: something is broken for me, the order of messages are not correct.

[stefanprobst]

P.S: something is broken for me, the order of messages are not correct.

yeah for me too, my first message was 1h in the future o_O

If you convert the file to be a TypeScript file, then we have to do @ts-ignore

hmm, yes i'm seeing that too now. do you have any idea what could be wrong with these package exports:

https://github.com/stefanprobst/rehype-extract-toc/blob/main/package.json#L10-L19

the only workaround i can think of is to add "./*": "./*" to package exports, so at least importing from @stefanprobst/rehype-extract-toc/src/mdx would work correctly.

[yordis]

I added some package.json under mdx directory that I think should done the job, but I am not sure, I have never use exports before but as far as I can tell it is not for that thou, but again, I am not 100% sure

[stefanprobst]

afaiu package exports should be exactly for that, but it seems typescript does not (yet) understand this? i re-added the separate package.json you had added in the pr (sorry for not checking before removing!). could you try with 2.1.2 if it works for you?

[yordis]

Hah, https://github.com/stefanprobst/rehype-extract-toc/blob/a8ead0cc0c6faba10628d8df7f3ae8a3ecbb5130/package.json#L20-L22

You need to add mdx to the list of files to upload, it is broken still because of it

[stefanprobst]

yep just realized - try 2.1.3

[yordis]

Thank you so much!

[stefanprobst]

thank you!