Imports
How to import components into your project
Report Issue ↗️To start using Webcore components in your code, import them from webcoreui/astro
, webcoreui/svelte
, or webcoreui/react
, depending on your project:
Importing Icons
While Webcore provides an Icon
component that can be used for rendering SVG icons on the server, it can drastically increase your bundle size if used on the client, as it prebundles all icons.
If you want to include icons provided by Webcore on the client-side, it’s recommended to import them directly as strings using the following imports:
This can be useful in cases where you cannot use a component. In this case, the value of info
will be an SVG string that you can use to dynamically render the icon. To see available icons for import, visit the Icon
component documentation.
Icon
component where appropriate. If you use Webcore on the client, it’s recommended to use the above import instead. Utilities
If you need to use utility functions within your project, you can import them directly from webcoreui
:
To see all available utility functions provided by Webcore, visit the Utilities documentation page.
CSS Imports
Apart from the above-mentioned modules, Webcore also exposes the following two exports that you can import and use within your SCSS files:
Import | Purpose |
---|---|
webcoreui/styles | Imports the setup mixin that loads other SCSS files depending on your CSS configuration. |
webcoreui/config | Use at the top of your SCSS files if you'd like to use the mixins provided by Webcore. |
Request improvement for this page