Include CDN sources in gulp -inject

Question

I am trying to get CDN and other HTTP resources in a script that is modified by gulp-inject .

I created the corresponding problem in the repository.

The bottom line is that I would like something in these lines to work:

var sources = [
  "http://cdnjs.cloudflare.com/ajax/libs/jasmine/1.3.1/jasmine.js",
  "./spec/test.js"
]

gulp.task('source', function () {
   gulp.src("src/my.html")
       .pipe(inject(sources))
       .dest("dest/")
})

In this case, the result is included in dest/my.html:

<script src='http://cdnjs.cloudflare.com/ajax/libs/jasmine/1.3.1/jasmine.js'>
</script>
<script src='/spec/test.js'></script>

Anyone have any thoughts?

Answer 1

I wrote a plugin gulp-cdnizer, in particular, to help in this situation.

It is designed so that you can locally store all CDN sources during development, and then, when creating the distribution, replace the local path with the CDN path.

, HTML . gulp-inject gulp-cdnizer CDN.

gulp.task('source', function () {
   return gulp.src("src/my.html")
       .pipe(inject(sources)) // only local sources
       .pipe(cdnizer([
           {
               package: 'jasmine',
               file: 'bower_components/jasmine/jasmine.js',
               cdn: 'http://cdnjs.cloudflare.com/ajax/libs/jasmine/${version}/jasmine.js'
           }
       ])
       .dest("dest/")
});

, . cdnizer , , , CDN ( - ).