Usage with preact

You can use Mantine with preact the same way as with react with no extra steps.

Setting up preact project

Use preact-cli to scaffold new project:

npx preact-cli create default mantine-preact

Create preact.config.js to setup aliases for react:

export default {
webpack(config, env) {
config.resolve = {
alias: {
react: 'preact/compat',
'react-dom/test-utils': 'preact/test-utils',
'react-dom': 'preact/compat',
return config;

Install mantine dependencies:

npm install @mantine/core @mantine/hooks react-jss

And start application:

npm run dev

Now you can use all components from @mantine/core and hooks from @mantine/hooks.


TypeScript with preact

Unfortunately, we were not able to setup Mantine with TypeScript + preact because of this issue. If you know how to solve it, please create a pull request with addition to this guide.