Gulp connect, обслуживающий некоторые ресурсы из каталога, отличного от "root"

Question

Интересно, возможно ли с gulp-connect обслуживать некоторые файлы из другого каталога. Что-то вроде:

http://localhost:8080/index.html => root: '/root/app'

но

http://localhost:8008/js/main.js => from '/root/js/' not from 'root/app/js' 
http://localhost:8008/css/main.css => from '/root/css/' not from 'root/app/css/' 

Answer 1

Вы можете передать функцию промежуточного программного обеспечения gulp-connect это позволяет вам изменить объект запроса и, следовательно, переписать URL запроса:

gulp.task('serve', function() {
  connect.server({
    root: 'root',
    middleware: function() {
      return [ function(req, res, next) {
        if (!/^\/(js|css)\/.*/.test(req.url)) {
          req.url = '/app' + req.url;
        }
        next();
      }];
    }
  });
});

В приведенном выше любой путь, который начинается с /js/ или же /css/ будет передано без изменений. Так как наша базовая папка root это означает, что путь как /js/main.js будет разрешать root/js/main.js,

Все остальные пути будут дополнены /app, означая путь как /index.html будет прозрачно разрешить root/app/index.html,

Вместо использования пользовательской логики, как я делал выше, вы также можете использовать что-то вроде http-rewrite-middleware, что позволяет вам задавать выражения перезаписи в стиле nginx:

var rewrite = require('http-rewrite-middleware');

gulp.task('serve', function() {
  connect.server({
    root: 'root',
    middleware: function() {
      return [ rewrite.getMiddleware([
        { from: '^/js/(.*)$', to: '/js/$1' },
        { from: '^/css/(.*)$', to: '/css/$1' },
        { from: '^(.*)$', to: '/app/$1' }
      ])];
    }
  });
});