angular-intro with requireJS

[rishy]

I am trying to use angular-intro with requireJS.

Steps I followed till now:

1. Installed angular-intro using bower as, bower install anuglar-intro.js --save
2. Added intro.js and angular-intro.js into requireJS "main" file, in the same order.
3. Added [ 'intro' , 'angular'] as "deps" for angular-intro.
4. set ng-intro-autostart="true"

But when I run my server, even after the successful loading of intro.js and angular-intro.js file in this order, I am getting an error as,
ReferenceError: introJs is not defined

I don't understand how angular-intro can't find introJs function, even if intro.js has been added prior to it? What is the right way to add both of these files so that it works properly?

[mendhak]

I don't know much about require.js, but I've been doing a bit of investigating.

I found this issue in which it is described that intro.js behaves differently when loaded using require.js. This means that when angular-intro calls new IntroJs(), it can't find anything because IntroJs isn't on the global namespace.

I then modified the angular-intro.js file with a define:

define(['intro'], function(introJs) {
     ngIntroDirective.directive('ngIntroOptions', ['$timeout', function ($timeout) {
    .....

This would make the IntroJs available to the directive.

And it worked.

However, I explicitly modified the directive with a define.

What I don't know is how to properly solve your problem; if I were to put a define in this repository's code, it'll break for people who don't use require; I wonder if you can wrap some other part of your code to inject introJs.

Or, make a copy of angular-intro.js in your own directives folder, modify it to inject, and use it.

[rishy]

Yeah I figured that out. I had to make a copy of intro.js into one of my directives folder and then I modified it as:

For now it is working, hope to see a fix for this in near future. Thanks btw.

[mrzmyr]

+1

[tobigit]

+1

[mendhak]

Release 1.2.2 should have this now
https://github.com/mendhak/angular-intro.js/releases/tag/v1.2.2