Angular-ui-tinymce dependency not included

[hajderr]

I have a simple project with the following dependencies in bower.json and I'm having trouble with main-bower-files not including the dependency of angular-ui-tinymce, which is tinymce.

"dependencies": {
"angular": "~1.5.3",
"angular-route": "~1.5.3",
"angular-ui-tinymce": "latest",
"bootstrap": "3.3.7"
},

After bower install angular-ui-tinymce will pull in tinymce and the resulting bower_components is the following

This is the debug output from running gulp. As you can see the tinymce-dist directory is skipped. Is there a conflict here with the file names or do I have to override the main?

[10:53:27] Starting 'bower'...
[ '/Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular/angular.js',
  '/Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular-route/angular-route.js',
  '/Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/jquery/dist/jquery.js',
  '/Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular-ui-tinymce/src/tinymce.js',
  '/Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/bootstrap/less/bootstrap.less',
  '/Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/bootstrap/dist/js/bootstrap.js' ]
PackageCollection add                     angular           /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular
Package           overriding main         angular           ./angular.js
Package           overriding dependencies angular           {}
PackageCollection add                     angular-route     /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular-route
Package           overriding main         angular-route     ./angular-route.js
Package           overriding dependencies angular-route     {"angular":"1.5.8"}
PackageCollection add                     angular-ui-tinymce /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular-ui-tinymce
Package           overriding main         angular-ui-tinymce ./src/tinymce.js
Package           overriding dependencies angular-ui-tinymce {"angular":">=1.4.0","tinymce-dist":"~4.3.0"}
PackageCollection add                     tinymce-dist      /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/tinymce-dist
PackageCollection add                     bootstrap         /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/bootstrap
Package           overriding main         bootstrap         ["less/bootstrap.less","dist/js/bootstrap.js"]
Package           overriding dependencies bootstrap         {"jquery":"1.9.1 - 3"}
PackageCollection add                     jquery            /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/jquery
Package           overriding main         jquery            dist/jquery.js
Package           select file             angular           /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular/angular.js
Package           select file             angular-route     /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular-route/angular-route.js
Package           select file             jquery            /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/jquery/dist/jquery.js
Package           select file             angular-ui-tinymce /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/angular-ui-tinymce/src/tinymce.js
Package           select file             bootstrap         /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/bootstrap/less/bootstrap.less
Package           select file             bootstrap         /Users/username/IdeaProjects/Bello/api/src/main/resources/static/bower_components/bootstrap/dist/js/bootstrap.js

[ck86]

@hajderr the problem is that tinymce-dist does not have a main property in its bower.json file. So main-bower-files does not know which file to include.

[hajderr]

@ck86 alright, so I understand I should probably override it myself. Adding the below brings me one step closer. Question is, what's the best way to bring to rest of the module when running gulp? The first issue concerns that themes/ directory is missing, which is required for tinymce to load.

Override in bower.json for tinymce-dist dependency

"overrides" : {
    "tinymce-dist" : {
      "main" : "tinymce.js"
    }
  }

Themes content missing

GET http://localhost:9000/dist/js/themes/modern/theme.min.js 404

I anticipate the same error with the plugins/ directory later on.

[ck86]

The main property could be an array:

"overrides" : {
    "tinymce-dist" : {
      "main" : [
        "tinymce.js",
        "themes/modern/theme.min.js"
      ]
    }
  }

[hajderr]

Sure, thanks. I think I close this issue as the rest of the issues with including tinymce does not concern main-bower-files.

[ck86]

Yes I know and I would not recommend to use main-bower-files for tinymce :D

[hajderr]

@ck86 hehe, well I see what you mean. I ended up doing a simple gulp task, pasting below for future reference, should anyone stumble upon this issue.

gulp.task('bower-tinymce', function() {

    //Copy resources from tinymce-dist that didn't make it in the bower-files
    return gulp.src('src/main/resources/static/bower_components/tinymce-dist/**/*').pipe(gulp.dest('src/main/resources/static/dist/tinymce'));

});

Then you can simply reference it in your index.html

<script src="dist/tinymce/tinymce.js" type="text/javascript"></script>