Skip to content

Confused as to the usage of this plugin in regards to new filepaths #66

@kchima

Description

@kchima

This may be more of a useref question but I believe you might be able to answer it. My code, similar to the example on the main page, properly generates concatted/minified:

styles/vendor.css 
scripts/vendor.js
index.html

in my dist directory, but now what?

Do I now need to change my app to use, by default, dist/index.html vs the regular index.html in my home directory? This would be fine, but then it can't seem to find the vendor.js or vendor.css unless I change the html base tag from

<base href="/" />
To:

<base href="/dist" />

This seems to screw up the other paths/URLs in my angular app, for instance redirecting my home page to:

localhost:8080/dist/posts

instead of:

localhost:8080/posts

Overall I'm just confused by the usage.

Here is the relevant part of my gulpfile, for what it's worth:

var bases = {
 app: 'app/',
 dist: ['src/main/webapp/dist']
};

gulp.task('clean', function() {
 return gulp.src(bases.dist)
 .pipe(clean());
});

gulp.task("prodBuild", ['clean'], function() {
  var jsFilter = filter(paths.scripts, { restore: true });
  var cssFilter = filter(paths.styles, { restore: true });
  var indexHtmlFilter = filter(['**/*'], { restore: true });

  return gulp.src(['src/main/webapp/index.html'])
    .pipe(useref())
    .pipe(jsFilter)
    .pipe(uglify())      // Minify any javascript sources
    .pipe(jsFilter.restore)
    .pipe(cssFilter)
    .pipe(csso())         // Minify any CSS sources
    .pipe(cssFilter.restore)
    .pipe(indexHtmlFilter)
    .pipe(rev())                // Rename the concatenated files (but not index.html)
    .pipe(indexHtmlFilter.restore)
    .pipe(gulp.dest('src/main/webapp/dist'));
});

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions