exotic-emerald•13mo ago

Is there an example known to be properly working in a pnpm monorepo?

The bootstrapped examples I tried either from refine.new or create refine-app always end up with some kind of errors. (Mostly related to imports)

12 Replies

kapa.ai•13mo ago

Hi @aerocosmic. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- I'm sorry to hear that you're having trouble with bootstrapping a refine application. The errors you're encountering might be due to a variety of factors. However, based on the information provided in the extracts, here are a few suggestions: 1. Check your environment: Refine works on any environment that can run React, including Vite, Next.js, Remix, and CRA(Legacy) etc. Make sure your environment is set up correctly to run React applications. source (https://refine.dev/docs/getting-started/quickstart) 2. Ensure correct installation: After bootstrapping your application, you should navigate to the project folder, install the dependencies, and then start your project. Here are the commands for that:

npm install  
npm run dev

npm install  
npm run dev

source (https://refine.dev/docs/getting-started/quickstart) 3. Check your import statements: Make sure you're importing the correct modules from the correct packages. For example, in a typical Refine application, you might see imports like these:

import { GitHubBanner, Refine, WelcomePage } from "@refinedev/core";  
import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";  
import { notificationProvider } from "@refinedev/antd";  
import "@refinedev/antd/dist/reset.css";  
import routerBindings, {  
 UnsavedChangesNotifier,  
} from "@refinedev/react-router-v6";  
import dataProvider from "@refinedev/simple-rest";  
import { BrowserRouter, Route, Routes } from "react-router-dom";  
import { ColorModeContextProvider } from "./contexts/color-mode";

import { GitHubBanner, Refine, WelcomePage } from "@refinedev/core";  
import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";  
import { notificationProvider } from "@refinedev/antd";  
import "@refinedev/antd/dist/reset.css";  
import routerBindings, {  
 UnsavedChangesNotifier,  
} from "@refinedev/react-router-v6";  
import dataProvider from "@refinedev/simple-rest";  
import { BrowserRouter, Route, Routes } from "react-router-dom";  
import { ColorModeContextProvider } from "./contexts/color-mode";

source (https://refine.dev/blog/building-react-admin-dashboard) If you're still encountering issues, it might be helpful to look at the specific error messages you're getting and try to troubleshoot from there. If the errors are related to specific packages or modules, you might find it helpful to look at the documentation for those packages or modules. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•13mo ago

<@668817956217815043> kapa.ai is still learning and improving, please let us how it did by reacting below

exotic-emerald•13mo ago

Suggested steps in 2. aren't for a pnpm install @kapa.ai

Omer•13mo ago

Hey @aerocosmic , We are experiencing some difficulties with pnpm. Could you please review this GitHub issue? https://github.com/refinedev/refine/issues/4439

GitHub

[BUG] Clean install doesn't compile: export 'TranslationContext' (i...

Describe the bug I just set up a refine project and tried to run it without changing anything but it does not compile. It rather shows this error: ERROR in ./node_modules/.pnpm/@refinedev+inference...

exotic-emerald•13mo ago

https://refine.new/preview/65b3b4e9-7f64-4630-89df-a5fb6fad6a79 pnpm install pnp run dev ==> Not working pnpm install @refinedev/core@latest pnpm run dev ==> Not working pnpm store prune Removed all cached metadata files Removed 17939 files Removed 80 packages

Preview - refine.new - Open-source enterprise application platform ...

Enterprise-grade, production-ready, and highly scalable web apps in minutes.

exotic-emerald•13mo ago

C:\PROG\lionelhorn-tests\automation-console-new-pnpm>pnpm install @refinedev/core@latest 
 WARN  deprecated i18next-xhr-backend@3.2.2: replaced by i18next-http-backend
 WARN  deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
 WARN  deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
 WARN  deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecated
 WARN  deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
Already up to date
Progress: resolved 882, reused 856, downloaded 4, added 0, done
 WARN  Issues with peer dependencies found
.
├─┬ @refinedev/chakra-ui 2.5.4
│ └─┬ @tabler/icons 1.35.0
│   ├── ✕ unmet peer react@^16.13.1: found 18.0.0
│   └── ✕ unmet peer react-dom@^16.13.1: found 18.0.0
├─┬ @refinedev/cli 2.5.1
│ ├─┬ ink 3.2.0
│ │ └─┬ react-reconciler 0.26.2
│ │   └── ✕ unmet peer react@^17.0.2: found 18.0.0
│ └─┬ ink-markdown 1.0.1
│   └─┬ marked-terminal 4.2.0
│     └── ✕ unmet peer marked@"^1.0.0 || ^2.0.0": found 0.8.2
└─┬ @refinedev/kbar 1.1.0
  └─┬ kbar 0.1.0-beta.41
    └─┬ react-virtual 2.10.4
      └── ✕ unmet peer react@"^16.6.3 || ^17.0.0": found 18.0.0

Done in 12.6s

C:\PROG\lionelhorn-tests\automation-console-new-pnpm>pnpm install @refinedev/core@latest 
 WARN  deprecated i18next-xhr-backend@3.2.2: replaced by i18next-http-backend
 WARN  deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
 WARN  deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
 WARN  deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecated
 WARN  deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
Already up to date
Progress: resolved 882, reused 856, downloaded 4, added 0, done
 WARN  Issues with peer dependencies found
.
├─┬ @refinedev/chakra-ui 2.5.4
│ └─┬ @tabler/icons 1.35.0
│   ├── ✕ unmet peer react@^16.13.1: found 18.0.0
│   └── ✕ unmet peer react-dom@^16.13.1: found 18.0.0
├─┬ @refinedev/cli 2.5.1
│ ├─┬ ink 3.2.0
│ │ └─┬ react-reconciler 0.26.2
│ │   └── ✕ unmet peer react@^17.0.2: found 18.0.0
│ └─┬ ink-markdown 1.0.1
│   └─┬ marked-terminal 4.2.0
│     └── ✕ unmet peer marked@"^1.0.0 || ^2.0.0": found 0.8.2
└─┬ @refinedev/kbar 1.1.0
  └─┬ kbar 0.1.0-beta.41
    └─┬ react-virtual 2.10.4
      └── ✕ unmet peer react@"^16.6.3 || ^17.0.0": found 18.0.0

Done in 12.6s

pnpm run dev
X [ERROR] No matching export in "node_modules/.pnpm/@tabler+icons@1.35.0_react-dom@18.0.0_react@18.0.0/node_modules/@tabler/icons/icons-react/dist/index.esm.js" for import "IconLayoutSidebarLeftCollapse"

    node_modules/.pnpm/@refinedev+chakra-ui@2.5.4_@chakra-ui+react@2.5.1_@refinedev+cli@2.5.1_@refinedev+core@4.28.0_asykzuzoivi2lozrtvgzbjtlby/node_modules/@refinedev/chakra-ui/dist/esm/index.js:1:11437:
      1 │ ...-ui/react";import{IconLayoutSidebarLeftCollapse as qn,IconLayout...
        ╵                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
[...]

pnpm run dev
X [ERROR] No matching export in "node_modules/.pnpm/@tabler+icons@1.35.0_react-dom@18.0.0_react@18.0.0/node_modules/@tabler/icons/icons-react/dist/index.esm.js" for import "IconLayoutSidebarLeftCollapse"

    node_modules/.pnpm/@refinedev+chakra-ui@2.5.4_@chakra-ui+react@2.5.1_@refinedev+cli@2.5.1_@refinedev+core@4.28.0_asykzuzoivi2lozrtvgzbjtlby/node_modules/@refinedev/chakra-ui/dist/esm/index.js:1:11437:
      1 │ ...-ui/react";import{IconLayoutSidebarLeftCollapse as qn,IconLayout...
        ╵                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
[...]

@Omer Still not working

Omer•13mo ago

You can try with npm and yarn.

exotic-emerald•13mo ago

Same exact code works with npm. (already tried) But I can't use npm as all my work is in a pnpm monorepo. Would pnpm run refine update help in any way?

Omer•13mo ago

Got it. You can wait for the GitHub issue to be fixed

exotic-emerald•13mo ago

I had code based on an example working with pnpm in a monorepo at some point. I had to tweak the .npmrc to accomodate another package. Doesn't work anymore. Now even the example unmodified doesn't work anymore. Any idea of the priority of the said issue on github in your pipeline?

Omer•13mo ago

Unfortunately, I can't provide a specific date. However, I believe we can resolve it within 3-4 weeks. If that doesn't work for you, you can apply to refine's Priority Support Program. You can find more information at https://refine.dev/pricing

exotic-emerald•13mo ago

Thanks for the info.