steven-tey / novel

Notion-style WYSIWYG editor with AI-powered autocompletion.
https://novel.sh
Apache License 2.0
12.21k stars 1.02k forks source link

bug: cannot import `novel/extension` in a Next.js project #353

Closed arielweinberger closed 5 months ago

arielweinberger commented 5 months ago

Provide environment information

  System:
    OS: macOS 14.0
    CPU: (12) arm64 Apple M2 Max
    Memory: 9.06 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
    pnpm: 8.14.3 - ~/.nvm/versions/node/v20.10.0/bin/pnpm
    Watchman: 2023.11.27.00 - /opt/homebrew/bin/watchman

Describe the bug

I'm struggling to import novel/extensions due to some TS error. My Next.js project has:

    "module": "esnext",
    "moduleResolution": "node",

Which is standard and hasn't caused any issue with other libraries. Specifically for novel/extensions, I get this:

Cannot find module 'novel/extensions' or its corresponding type declarations.
  There are types at '/Users/arielweinberger/Development/academia-helper/node_modules/novel/dist/extensions.d.ts', but this result could not be resolved under your current 'moduleResolution' setting. Consider updating to 'node16', 'nodenext', or 'bundler'.ts(2307)

I assume this is related to using exports in package.json?

Link to reproduction

-

To reproduce

Set up a fresh Next.js repo and try to use Novel:

import {
  EditorBubble,
  EditorBubbleItem,
  EditorCommand,
  EditorCommandItem,
  EditorContent,
  EditorRoot,
} from 'novel'

import {
  TiptapImage,
  TiptapLink,
  UpdatedImage,
  TaskList,
  TaskItem,
  HorizontalRule,
  StarterKit,
  Placeholder,
} from "novel/extensions";

export default async function IndexPage() {
  return (
    <EditorRoot>
      <EditorContent extensions={defaultExtensions}></EditorContent>
    </EditorRoot>
  )
}

Additional information

No response

arielweinberger commented 5 months ago

My bad, I just checked and the default values for a fresh Next.js app are:

    "module": "ESNext",
    "moduleResolution": "Bundler",

Changed to this and it works. Thanks.