Import UIkit Angular FullStack

Issue

I’m getting this error trying to import UIkit with Angular FullStack generator:

Module 'uikit' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

This is what I’ve done:

webpack.make.js

    if(TEST) {
        config.entry = {};
    } else {
        config.entry = {
            app: './client/app/app.js',
            polyfills: './client/polyfills.js',
            vendor: [
                'angular',
                'angular-animate',
                'angular-aria',
                'angular-cookies',
                'angular-resource',

                'angular-sanitize',


                'angular-ui-router',
                'lodash',

                'uikit'
            ]
        };
    }

app.js

...
import uikit from 'uikit';
...

angular.module('myApp', [ngCookies, ngResource, ngSanitize, uiRouter, uikit])

However, I can use the style directives by adding the following to my app.scss:

@import'~uikit/dist/css/uikit.css';

But, if I don’t import the JS module, I get UIkit is not defined.

How can I properly import UIkit to my project??

Thanks in advance 🙂

Solution

Following the docs, this is what worked for me:

1. Do not add uikit vendor to webpack.make.js
2. Insert import UIkit from 'uikit'; to my app.js

Answered By – nash

Answer Checked By – Jay B. (AngularFixing Admin)