импорт uikit меньше в веб-пакете

Question

Я пытаюсь использовать uikit с webpack.Документация для uikit гласит:

ПРИМЕЧАНИЕ. Для простоты мы включили предварительно созданный CSS.В реальном проекте вы, вероятно, захотите собрать файлы Less и включить вместо этого скомпилированный CSS.

Поэтому я пытаюсь использовать для этого less-loader.Но получите эту ошибку:

ERROR in ./src/index.js 1:0
Module parse failed: Unexpected character '@' (1:0)
You may need an appropriate loader to handle this file type.
> @import '~uikit/src/less/uikit';
| import m from 'mithril'
| import UIkit from 'uikit';
ℹ ｢wdm｣: Failed to compile.
^C
➜  npm git:(npm) ✗ cat webpack.config.js
var path = require('path');

module.exports = {
  mode: 'development',
  module: {
    rules: [
      {
        test: /\.css$/,
        loaders: ['style-loader', 'css-loader']
      },
      {
        test: /\.less$/,
        use: [{
          loader: 'style-loader'
        }, {
          loader: 'css-loader'
        }, {
          loader: 'less-loader'
        }]
      }
    ]
  }
};
➜  npm git:(npm) ✗ cat src/index.js
@import '~uikit/src/less/uikit';
import m from 'mithril'
import UIkit from 'uikit';
import Icons from 'uikit/dist/js/uikit-icons';

m.render(document.body, "hello world");
UIkit.use(Icons);
UIkit.notification('hello');