Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Using Gulp's 'gulp-useref' For a Full Build Pipeline

Marcy Montross
PLUS
Marcy Montross
Courses Plus Student 5,382 Points
Posted by Marcy Montross
Marcy Montross
Courses Plus Student 5,382 Points

Please provide updated code. The the updated coded in the 'ReadMe' file doesn't work in this example.

according to the ReadMe, the following error: 'TypeError: useref.assets is not a function' is a migration error. I followed the suggestions, adapted the suggested code to the example, but I'm still getting errors.

1 Answer

Adam Fields
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Adam Fields
Full Stack JavaScript Techdegree Graduate 37,838 Points
Adam Fields
.a{fill-rule:evenodd;}techdegree seal-36
Adam Fields
Full Stack JavaScript Techdegree Graduate 37,838 Points

Here is the updated code:

gulp.task('html', ['sass'], () => {
  gulp.src('src/index.html')
    .pipe(useref())
    .pipe(iff('*.js', uglify()))
    .pipe(iff('*.css', csso()))
    .pipe(gulp.dest('dist'));
});

It's basically the same as the gulp-useref README, but with our JavaScript and CSS pipes added in.

Without seeing the rest of your gulpfile, I'm not sure what else could be causing errors. Here is the link to my repo with the finished and working app: https://github.com/adamelliotfields/treehouse-javascript/tree/master/gulp-basics

The only glaring difference with my code is that I'm using browser-sync instead of http-server. If you run npm run watch or yarn watch and make changes to the Sass, browser-sync will live reload the page so you don't need to hit refresh. The script is in the package.json file.