{"action":"created","issue":{"url":"https://api.github.com/repos/coderhaoxin/gulp-file-include/issues/69","labels_url":"https://api.github.com/repos/coderhaoxin/gulp-file-include/issues/69/labels{/name}","comments_url":"https://api.github.com/repos/coderhaoxin/gulp-file-include/issues/69/comments","events_url":"https://api.github.com/repos/coderhaoxin/gulp-file-include/issues/69/events","html_url":"https://github.com/coderhaoxin/gulp-file-include/issues/69","id":94128513,"number":69,"title":"Implementing 'gulp-file-include' in 'yeoman/generator-gulp-webapp'","user":{"login":"MsTrends","id":10553273,"avatar_url":"https://avatars.githubusercontent.com/u/10553273?v=3","gravatar_id":"","url":"https://api.github.com/users/MsTrends","html_url":"https://github.com/MsTrends","followers_url":"https://api.github.com/users/MsTrends/followers","following_url":"https://api.github.com/users/MsTrends/following{/other_user}","gists_url":"https://api.github.com/users/MsTrends/gists{/gist_id}","starred_url":"https://api.github.com/users/MsTrends/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/MsTrends/subscriptions","organizations_url":"https://api.github.com/users/MsTrends/orgs","repos_url":"https://api.github.com/users/MsTrends/repos","events_url":"https://api.github.com/users/MsTrends/events{/privacy}","received_events_url":"https://api.github.com/users/MsTrends/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":6,"created_at":"2015-07-09T19:08:42Z","updated_at":"2015-07-09T20:10:22Z","closed_at":"2015-07-09T19:37:16Z","body":"I'm using [yeoman/generator-gulp-webapp][1] and I've added [gulp-file-include][1] plugin. I've generated vanilla `gulpfile.babel.js` by using yeoman, now i'm able to implement file-include command within 'html' task and with 'gulp html' command i'm able to compile html files correctly,\r\nbut I'm not sure how to implement file-include plugin in this file (gulpfile.babel.js) in such a way that it works with `gulp serve` seamlessly.\r\n\r\nI've tried to implement it with no luck. Following is the code from my `gulpfile.babel.js` file:\r\n\r\n    // generated on 2015-07-07 using generator-gulp-webapp 1.0.2\r\n    import gulp from 'gulp';\r\n    import gulpLoadPlugins from 'gulp-load-plugins';\r\n    import browserSync from 'browser-sync';\r\n    import del from 'del';\r\n    import {stream as wiredep} from 'wiredep';\r\n    \r\n    const $ = gulpLoadPlugins();\r\n    const reload = browserSync.reload;\r\n    \r\n    gulp.task('styles', () => {\r\n      return gulp.src('app/styles/*.scss')\r\n        .pipe($.plumber())\r\n        .pipe($.sourcemaps.init())\r\n        .pipe($.sass.sync({\r\n          outputStyle: 'expanded',\r\n          precision: 10,\r\n          includePaths: ['.']\r\n        }).on('error', $.sass.logError))\r\n        .pipe($.autoprefixer({browsers: ['last 1 version']}))\r\n        .pipe($.sourcemaps.write())\r\n        .pipe(gulp.dest('.tmp/styles'))\r\n        .pipe(reload({stream: true}));\r\n    });\r\n    \r\n    function lint(files, options) {\r\n      return () => {\r\n        return gulp.src(files)\r\n          .pipe(reload({stream: true, once: true}))\r\n          .pipe($.eslint(options))\r\n          .pipe($.eslint.format())\r\n          .pipe($.if(!browserSync.active, $.eslint.failAfterError()));\r\n      };\r\n    }\r\n    const testLintOptions = {\r\n      env: {\r\n        mocha: true\r\n      },\r\n      globals: {\r\n        assert: false,\r\n        expect: false,\r\n        should: false\r\n      }\r\n    };\r\n    \r\n    gulp.task('lint', lint('app/scripts/**/*.js'));\r\n    gulp.task('lint:test', lint('test/spec/**/*.js', testLintOptions));\r\n    \r\n    gulp.task('html', ['styles'], () => {\r\n      const assets = $.useref.assets({searchPath: ['.tmp', 'app', '.']});\r\n    \r\n      return gulp.src('app/*.html')\r\n        .pipe(assets)\r\n        .pipe($.if('*.js', $.uglify()))\r\n        .pipe($.if('*.css', $.minifyCss({compatibility: '*'})))\r\n        .pipe(assets.restore())\r\n        .pipe($.useref())\r\n        .pipe($.if('*.html', $.fileInclude({prefix: '@@', basepath: '@file'})))\r\n        .pipe($.if('*.html', $.minifyHtml({conditionals: true, loose: true})))\r\n        .pipe(gulp.dest('dist'));\r\n    });\r\n    \r\n    gulp.task('images', () => {\r\n      return gulp.src('app/images/**/*')\r\n        .pipe($.if($.if.isFile, $.cache($.imagemin({\r\n          progressive: true,\r\n          interlaced: true,\r\n          // don't remove IDs from SVGs, they are often used\r\n          // as hooks for embedding and styling\r\n          svgoPlugins: [{cleanupIDs: false}]\r\n        }))\r\n        .on('error', function (err) {\r\n          console.log(err);\r\n          this.end();\r\n        })))\r\n        .pipe(gulp.dest('dist/images'));\r\n    });\r\n    \r\n    gulp.task('fonts', () => {\r\n      return gulp.src(require('main-bower-files')({\r\n        filter: '**/*.{eot,svg,ttf,woff,woff2}'\r\n      }).concat('app/fonts/**/*'))\r\n        .pipe(gulp.dest('.tmp/fonts'))\r\n        .pipe(gulp.dest('dist/fonts'));\r\n    });\r\n    \r\n    gulp.task('extras', () => {\r\n      return gulp.src([\r\n        'app/*.*',\r\n        '!app/*.html'\r\n      ], {\r\n        dot: true\r\n      }).pipe(gulp.dest('dist'));\r\n    });\r\n    \r\n    gulp.task('clean', del.bind(null, ['.tmp', 'dist']));\r\n    \r\n    gulp.task('serve', ['styles', 'fonts'], () => {\r\n      browserSync({\r\n        notify: false,\r\n        port: 9000,\r\n        server: {\r\n          baseDir: ['.tmp', 'app'],\r\n          routes: {\r\n            '/bower_components': 'bower_components'\r\n          }\r\n        }\r\n      });\r\n    \r\n      gulp.watch([\r\n        'app/*.html',\r\n        'app/scripts/**/*.js',\r\n        'app/images/**/*',\r\n        '.tmp/fonts/**/*'\r\n      ]).on('change', reload);\r\n    \r\n      gulp.watch('app/styles/**/*.scss', ['styles']);\r\n      gulp.watch('app/fonts/**/*', ['fonts']);\r\n      gulp.watch('bower.json', ['wiredep', 'fonts']);\r\n    });\r\n    \r\n    gulp.task('serve:dist', () => {\r\n      browserSync({\r\n        notify: false,\r\n        port: 9000,\r\n        server: {\r\n          baseDir: ['dist']\r\n        }\r\n      });\r\n    });\r\n    \r\n    gulp.task('serve:test', () => {\r\n      browserSync({\r\n        notify: false,\r\n        port: 9000,\r\n        ui: false,\r\n        server: {\r\n          baseDir: 'test',\r\n          routes: {\r\n            '/bower_components': 'bower_components'\r\n          }\r\n        }\r\n      });\r\n    \r\n      gulp.watch('test/spec/**/*.js').on('change', reload);\r\n      gulp.watch('test/spec/**/*.js', ['lint:test']);\r\n    });\r\n    \r\n    // inject bower components\r\n    gulp.task('wiredep', () => {\r\n      gulp.src('app/styles/*.scss')\r\n        .pipe(wiredep({\r\n          ignorePath: /^(\\.\\.\\/)+/\r\n        }))\r\n        .pipe(gulp.dest('app/styles'));\r\n    \r\n      gulp.src('app/*.html')\r\n        .pipe(wiredep({\r\n          exclude: ['bootstrap-sass'],\r\n          ignorePath: /^(\\.\\.\\/)*\\.\\./\r\n        }))\r\n        .pipe(gulp.dest('app'));\r\n    });\r\n    \r\n    gulp.task('build', ['lint', 'html', 'images', 'fonts', 'extras'], () => {\r\n      return gulp.src('dist/**/*').pipe($.size({title: 'build', gzip: true}));\r\n    });\r\n    \r\n    gulp.task('default', ['clean'], () => {\r\n      gulp.start('build');\r\n    });\r\n\r\n\r\n  [1]: https://github.com/yeoman/generator-gulp-webapp"},"comment":{"url":"https://api.github.com/repos/coderhaoxin/gulp-file-include/issues/comments/120131112","html_url":"https://github.com/coderhaoxin/gulp-file-include/issues/69#issuecomment-120131112","issue_url":"https://api.github.com/repos/coderhaoxin/gulp-file-include/issues/69","id":120131112,"user":{"login":"MsTrends","id":10553273,"avatar_url":"https://avatars.githubusercontent.com/u/10553273?v=3","gravatar_id":"","url":"https://api.github.com/users/MsTrends","html_url":"https://github.com/MsTrends","followers_url":"https://api.github.com/users/MsTrends/followers","following_url":"https://api.github.com/users/MsTrends/following{/other_user}","gists_url":"https://api.github.com/users/MsTrends/gists{/gist_id}","starred_url":"https://api.github.com/users/MsTrends/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/MsTrends/subscriptions","organizations_url":"https://api.github.com/users/MsTrends/orgs","repos_url":"https://api.github.com/users/MsTrends/repos","events_url":"https://api.github.com/users/MsTrends/events{/privacy}","received_events_url":"https://api.github.com/users/MsTrends/received_events","type":"User","site_admin":false},"created_at":"2015-07-09T20:10:22Z","updated_at":"2015-07-09T20:10:22Z","body":"I'm sorry i didn't understand what you are trying to say. I've tracked a previous ticket regarding 'browserSync' here: https://github.com/coderhaoxin/gulp-file-include/issues/51\r\n\r\nAnd i think my problem is very similiar to this, i've also tried your mentioned suggestion (i.e. adding .pipe(reload({ stream: true  })); to the end of html task), but it is of no use.\r\n\r\nCurrently, uncompiled .html files are in 'app' folder and what i've understood that these files must be compiled to '.tmp' folder (on 'gulp serve' command) in order to see the effect as '.tmp' folder has precedence over app, as described here: https://github.com/yeoman/generator-gulp-webapp/blob/master/docs/README.md#serve"}}