yarn build error

[joshfeng]

Self Checks

• This is only for bug report, if you would like to ask a quesion, please head to Discussions.
• I have searched for existing issues search for existing issues, including closed ones.
• I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
• Pleas do not modify this template :) and fill in all the required fields.

Dify version

0.6.3

Cloud or Self Hosted

Self Hosted (Source)

Steps to reproduce

yarn build

✔️ Expected Behavior

no error

❌ Actual Behavior

dify\web>yarn build
yarn run v1.22.19
$ next build
▲ Next.js 14.2.2

• Environments: .env.local

Creating an optimized production build ...
Failed to compile.

./node_modules/mermaid/dist/mindmap-definition-57868176.js
Module not found: Package path ./dist/cytoscape.umd.js is not exported from package \dify\web\node_modules\cytoscape (see exports field in \dify\web\node_modules\cytoscape\package.json)

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/mermaid/dist/mermaid-768dc893.js
./node_modules/mermaid/dist/mermaid.core.mjs
./app/components/app/chat/mermaid/index.tsx
./app/components/base/markdown.tsx
./app/components/app/text-generate/saved-items/index.tsx
./app/components/share/text-generation/index.tsx

Build failed because of webpack errors
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[dosubot]

The error you're encountering is due to the cytoscape package not being found or correctly installed in your project, as indicated by the message: "Package path ./dist/cytoscape.umd.js is not exported from package." Here's how to address this issue:

1. Ensure Cytoscape is Installed: First, add cytoscape to your project dependencies if it's missing:

   yarn add cytoscape

   This step is crucial if cytoscape is a direct dependency of your project.

2. Update Dependencies: If cytoscape is a sub-dependency (required by another package you use), try updating the parent package to ensure it includes cytoscape correctly.

3. Check Exports and Configuration: Verify the export path ./dist/cytoscape.umd.js is correct. If you have a custom Webpack configuration, ensure it's set up to resolve cytoscape properly.

4. Review Documentation: Consult the documentation for both cytoscape and any frameworks or libraries you're using it with (like Next.js) for compatibility notes or specific setup instructions.

If after following these steps the issue persists, it may be necessary to delve deeper into how cytoscape is integrated into your project, including checking for compatibility issues with other dependencies.

Sources

• web/package.json

About Dosu

This response is meant to be useful and save you time. It is not meant to be a precise solution, but rather a starting point for your own research.

Help me be more useful! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

If you want to continue the conversation, start your reply with @dosu-bot.

[qiansc]

Still have this problem.
add following to dify/web/node_modules/.pnpm/mermaid@10.4.0/node_modules/cytoscape/package.json as temporary resolution

    "./dist/cytoscape.umd.js": {
      "import": "./dist/cytoscape.umd.js",
      "require": "./dist/cytoscape.umd.js"
    }