I have angular, angular-ui-router and socket-io in my bower.json file.

When I run my gulp file (using wiredep), the two angular scripts are successfully added to my index.html file but the socket.io script is not - and I cannot figure out why. Thanks for any help

//mand line

[21:56:06] Using gulpfile ~/dev/projects/emerceVidChat/gulpfile.js
[21:56:06] Starting 'default'...
[21:56:06] Starting 'bower-dependencies'...
[21:56:06] Finished 'bower-dependencies' after 6.24 ms
[21:56:06] Finished 'default' after 7.24 ms

//bower.json

  "dependencies": {
    "angular": "~1.3.13",
    "socket.io": "~1.3.4",
    "angular-ui-router": "~0.2.13"
  }

// gulpfile.js

var gulp = require('gulp'),
    wiredep = require('wiredep').stream;

gulp.task('default', function() {
  gulp.start('bower-dependencies')
});

gulp.task('bower-dependencies', function () {  
  gulp.src('./build/index.html') 
    .pipe(wiredep({
      directory: './build/bower_ponents',
      bowerJson: require('./bower.json'),
    }))
    .pipe(gulp.dest('./build/'));
});

//index.html

<!-- bower:js -->
<script src="bower_ponents/angular/angular.js"></script>
<script src="bower_ponents/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endbower -->

//package.json

"devDependencies": {
    "gulp": "^3.8.11"
  }

I have angular, angular-ui-router and socket-io in my bower.json file.

When I run my gulp file (using wiredep), the two angular scripts are successfully added to my index.html file but the socket.io script is not - and I cannot figure out why. Thanks for any help

//mand line

[21:56:06] Using gulpfile ~/dev/projects/emerceVidChat/gulpfile.js
[21:56:06] Starting 'default'...
[21:56:06] Starting 'bower-dependencies'...
[21:56:06] Finished 'bower-dependencies' after 6.24 ms
[21:56:06] Finished 'default' after 7.24 ms

//bower.json

  "dependencies": {
    "angular": "~1.3.13",
    "socket.io": "~1.3.4",
    "angular-ui-router": "~0.2.13"
  }

// gulpfile.js

var gulp = require('gulp'),
    wiredep = require('wiredep').stream;

gulp.task('default', function() {
  gulp.start('bower-dependencies')
});

gulp.task('bower-dependencies', function () {  
  gulp.src('./build/index.html') 
    .pipe(wiredep({
      directory: './build/bower_ponents',
      bowerJson: require('./bower.json'),
    }))
    .pipe(gulp.dest('./build/'));
});

//index.html

<!-- bower:js -->
<script src="bower_ponents/angular/angular.js"></script>
<script src="bower_ponents/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endbower -->

//package.json

"devDependencies": {
    "gulp": "^3.8.11"
  }

• javascript
• html
• socket.io
• gulp
• wiredep

2 Answers 2

Socket.io itself does not have bower support, remember that it's the server, and not the client.

You can serve the client script with the socket server by setting its serveClient option to true, and insert it in your index directly with:

 <script src="socket.io/socket.io.js"></script>

Or install the client script that is referenced in bower but with another name:

bower install -save socket.io-client

If this package does not have a main property, you will have to override it in your main bower.json:

"overrides": {
  "socket.io-client": {
    "main": "socket.io.js"
  }
}

This way, wiredep will automatically inject it in your index.html.

Sometimes vendors exclude the optional main property in their bower.json file which, I believe, wiredep uses to pile the array of sourcefiles. Check the bower.json file within the bower_ponents/socket.io/ folder to see if they've included that. If not, maybe you can do a pull request to socket.io or at least raise an issue?