How do I create a component in "packages/ui" that uses "next" package? #5866
-
|
Hi everyone 👋 I've just used TurboRepo for the first time, so I'm creating my components in the Do I need to install the
package.json: {
"name": "ui",
"version": "0.0.0",
"main": "./index.tsx",
"types": "./index.tsx",
"license": "MIT",
"scripts": {
"lint": "eslint .",
"generate:component": "turbo gen react-component"
},
"dependencies": {
"next": "^13.4.19"
},
"devDependencies": {
"@turbo/gen": "^1.10.12",
"@types/node": "^20.5.2",
"@types/react": "^18.2.0",
"@types/react-dom": "^18.2.0",
"eslint-config-custom": "workspace:*",
"react": "^18.2.0",
"tailwind-config": "workspace:*",
"tsconfig": "workspace:*",
"typescript": "^4.5.2"
}
}What's de best way to do that? Thank you! |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 2 replies
-
|
You don't want to install
|
Beta Was this translation helpful? Give feedback.
-
|
Hi @anthonyshew, I found your example here in your website: https://www.shew.dev/monorepos/tools/nextjs#using-framework-specific-components-in-your-ui-package, @valentin-harrang you could have a look there! @anthonyshew I have a question regarding next/font... is it possible to share "next/font" fonts from a package to multiple next.js apps ? How would that approach look like ? Thank you! 🙏 |
Beta Was this translation helpful? Give feedback.
-
|
You won't want to install |
Beta Was this translation helpful? Give feedback.
-
|
To make |
Beta Was this translation helpful? Give feedback.
You don't want to install
nextinto youruipackage's dependencies directly. Rather, you have two options:You can design your component so that it expects a
linkComponentprop and use it so that linking works correctly for your framework.Use peerDependencies to make the dependency available from consumers: https://nodejs.org/en/blog/npm/peer-dependencies