coreui / coreui-icons-react Goto Github PK

What is the purpose of this error message?

In Nextjs I have got this error message:

error - ./node_modules/@coreui/icons-react/es/CIcon.css
Global CSS cannot be imported from within node_modules.
Read more: https://nextjs.org/docs/messages/css-npm
Location: node_modules@coreui\icons-react\es\CIcon.js

Looks like your package is not SSR compatible.

Possible solution is not importing the css in js file:
vercel/next.js#19936

looking at the dependencies, for example
@coreui/[email protected]
└─┬ @typescript-eslint/[email protected]
└─┬ [email protected]
└─┬ [email protected]
└── [email protected]

Shouldn't this @typesciprt-eslint be in dev dependencies? Trying to remove production vulenerabilities from my repo and this is coming up in npm audit --production.

https://codesandbox.io/p/sandbox/tender-panka-rgtq3f?file=%2Fapp%2Fpage.tsx%3A5%2C18

Do you support using the react packages in Next.js?

Message --
../node_modules/@coreui/icons-react/es/CIcon.js Module not found: Can't resolve 'react' in 'C:\Users\erdowi\Documents\node_modules\@coreui\icons-react\es' Error from chokidar (C:\): Error: EBUSY: resource busy or locked, lstat 'C:\hiberfil.sys'

When I run my app, it tells me that this cannot be resolved. I've tried the following

• clearing npm cache
• remove node_modules / lock file and redoing npm install
• manually install the packages and confirm they exist

I have an app that I've been upgrading from older versions of CoreUI.

I have the following usage of CIcon using the deprecated name property.

<CIcon size="lg" name="cis-warning"/>

This was working fine with react-scripts 4, but started breaking my app when I upgraded to react-scripts 5. The React app failed to render and this error was in the console:

Uncaught ReferenceError: process is not defined
    at index.es.js:1266:1
    at renderWithHooks (react-dom.development.js:12980:1)
    at updateForwardRef (react-dom.development.js:14813:1)
    at beginWork (react-dom.development.js:16553:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3555:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3599:1)
    at invokeGuardedCallback (react-dom.development.js:3654:1)
    at beginWork$1 (react-dom.development.js:20655:1)
    at performUnitOfWork (react-dom.development.js:19666:1)
    at workLoopSync (react-dom.development.js:19611:1)
(anonymous) @ index.es.js:1266

...

react_devtools_backend.js:2655 The above error occurred in the <CIcon> component:

Reading through the code in CIcon.tsx, I think using the deprecated properties name and content causes this error since the code for the deprecated warning access process:

if (name) {
      process &&
        process.env &&
        process.env.NODE_ENV === 'development' &&
        console.warn(
          '[CIcon] The `name` property is deprecated and will be removed in v3, please use `icon="..."` instead of.',
        )
    }

I'm not really sure how process works, but this was only an issue after upgrading to react-scripts 5. Not using the deprecated properties fixes it, but it seems incorrect to me that a deprecated property would crash the app, when it appears the intent is to log a warning.

Can you please fix the peer dependencies React of this package? When using this package in a project including React 17.* npm will throw error: Peer dependencies conflict" because the package.json defines 'React' ^16.3.1 as peer dependencies.

Thank you!

Hi,

there is locked react peerDependency to v17. You should use >= instead of ^ for version resolution. Atm it's not possible to upgrade to v18 and don't think there is any breaking change for components like this one...

Ty

When using the cut icon with the React Core UI Template it is shown like this

But if zoom is applied to the page the icon is displayed properly like this

Seems within the dist directory you dont place the ./CIcon.css file so no matter what styling or sizing nothing changes, unless rollup meant to handle it but im lost 🤷🏻