I'm making an R3F component library and getting the error Error: R3F: Hooks can only be used within the Canvas component!
when I import it into my project, even though the component is placed inside a Canvas component. Why?
I have the codes and rollup config setup inside package
folder here GlslPipeline for React.
I was testing the local after I run npm run build
in glsl-pipeline-react
and enter the command npm link
at the package
folder. Then I installed it onto my project folder using npm link "glsl-pipeline"
. It produces that error when run. Can anyone help me, please?
P/s: I'm not very familiar with Rollup or Vite setup. It's new to me.
I got it now. My own package that using rollup config, cannot be tested by using npm link
. It is complicated. I can do it using preconstruct workspaces inside examples
folder and create a new template inside examples
folder using npm create-vite@latest
refers to this link Create Template Code. And I can run test using preconstruct dev && yarn workspaces <example-folder-name> dev
.
In examples
folder, install any packages to test including your own current package name (Don't worry about haven't publish to npmjs yet. It can refers to the local package automatically), then try it out! It works!"