How to export jsx styled in a github package #2601
-
Hello! I have a problem exporting a jsx component from the styled function, which is in a github package the purpose of this package is to define my panda preset for a total of 3 apps, and also to serve as a mini ui kit, to export my jsx components which derive from recipes. I've already tried putting my component and recipe at the root of a test project(app/playground in the repo), and everything works correctly. Now the problem is to put it in a github package, I have a problem compiling / pnpm i, how can I do? [EDIT]: here's the repo: https://github.com/qotum/qotum i've followed some tutorial, but i dit not success to solve my problem I want my external next app to consume and that the error i get when i panda codegen
│ ✘ [ERROR] Could not resolve "../../../styled-system/jsx"
│ src/components/button/index.ts:1:23:
│ 1 │ import { styled } from "../../../styled-system/jsx";
│ ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
│ ✘ [ERROR] Could not resolve "../../../styled-system/recipes"
│ src/components/button/index.ts:2:23:
│ 2 │ import { button } from "../../../styled-system/recipes"; what can i do to resolve this ? |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 1 reply
-
the main issue was that you have a barrel file (index.ts that re-exports stuff) in your preset that includes both your components AND the preset made a PR that fixes this and other stuff here qotum/qotum#1 |
Beta Was this translation helpful? Give feedback.
-
Thank you so much @astahmer !
|
Beta Was this translation helpful? Give feedback.
the main issue was that you have a barrel file (index.ts that re-exports stuff) in your preset that includes both your components AND the preset
so when the panda.config was resolved and saw the preset import, it also was trying to bundle the whole components directory (including the styled-system)
made a PR that fixes this and other stuff here qotum/qotum#1