johnpapa / pluralsight-gulp

Starter Code for Pluralsight Course "JavaScript Build Automation with Gulp.js"
http://jpapa.me/gulpps
MIT License
158 stars 262 forks source link

Windows Enviroment: useref not injecting the files that are in "bower_components" #12

Open eliashdezr opened 9 years ago

eliashdezr commented 9 years ago

Explanation:

When gulp-inject adds the references from the bower components folder, it creates them with this path:

    <!-- build:css styles/vendor.css -->
    <!-- bower:css -->
    <link rel="stylesheet" href="../../bower_components/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.css" />
    <link rel="stylesheet" href="../../bower_components/toastr/toastr.css" />
    <!-- endbower -->
    <!-- endbuild -->

After running the optimize task, the _vendor.css_ and _vendor.js_ where not created in the build folder. The issue was that gulp-useref couldn't locate correctly the bower_components folder because was looking in a different path:

C:\Users\eliashdezr\bower_components\jquery\dist\jquery.js
C:\Users\eliashdezr\bower_components\angular\angular.js

Instead of this

C:\Users\eliashdezr\Desktop\pluralsight-gulp\bower_components\jquery\dist\jquery.js
C:\Users\eliashdezr\Desktop\pluralsight-gulp\bower_components\angular\angular.js

Solution/Workaround

I just added another pipe in the inject task using gulp-replace

gulp.task('inject', ['wiredep', 'styles', 'template-cache'], function () {
    log('Wire up the bower css and js references into the index.html');

    return gulp
        .src(config.index)
        .pipe($.inject(gulp.src(config.css)))
        .pipe($.replace(/="..\/..\/bower_components\//g, '="/bower_components/'))
        .pipe(gulp.dest(config.client));
});
87182485 commented 9 years ago

This works for me, thank you very much.

mccartymv commented 9 years ago

this worked for me as well on linux(ubuntu), thanks

TimCodes commented 9 years ago

Awesome, thanks for this

HectorLS commented 9 years ago

Awesome !!! thank you very much I was trying to figure out why the useref look two folders before like if we would used something like this:

../../

weird....

Dcolonel6 commented 8 years ago

just downloaded the zip folder...it has no bower_components directory in the root..

TimCodes commented 8 years ago

@Dcolonel6 try and install with bower type bower install in your command line or terminal