将grunt连接代理添加到生成器angular gruntfile.js中

Adding grunt-connect-proxy to generator-angular gruntfile.js

本文关键字：angular gruntfile js 连接 grunt 代理 添加      更新时间：2023-09-26

我正试图在一个yeoman generator angular项目（generator angular0.15.1）中将grunt connect代理添加到我的gruntfile.js中，但我似乎无法让它工作，因为它的编写方式发生了变化，而且我对grunt的工作方式缺乏经验。

我读过很多关于这方面的文章，但没有一篇是特别新的，gruntfile在实现liverload中间件的方式上似乎经常发生变化。这使得gruntconnect代理的文档在我的情况下不起作用。

棘手的部分在收货台下

这就是它在生成器角度咕哝文件中的样子：

// The actual grunt server settings
connect: {
  options: {
    port: 9000,
    // Change this to '0.0.0.0' to access the server from outside.
    hostname: 'localhost',
    livereload: 35729
  },
  proxies: [{
      context: '/api',
      host: 'localhost',
      port: 8080,
      https: false,
      xforward: false
    }],
  livereload: {
    options: {
      open: true,
      // --- how the code looks like before I do anything
      middleware: function (connect) {
        return [
          connect.static('.tmp'),
          connect().use('/bower_components', connect.static('./bower_components')),
          connect().use('/app/styles', connect.static('./app/styles')),
          connect.static(appConfig.app)
        ];
      }
    }
  },
  ...

当我查看文档时，它看起来像这样：

    livereload: {
        options: {
            middleware: function (connect, options) {
                if (!Array.isArray(options.base)) {
                    options.base = [options.base];
                }
                // Setup the proxy
                var middlewares = [require('grunt-connect-proxy/lib/utils').proxyRequest];
                // Serve static files.
                options.base.forEach(function(base) {
                    middlewares.push(connect.static(base));
                });
                // Make directory browse-able.
                var directory = options.directory || options.base[options.base.length - 1];
                middlewares.push(connect.directory(directory));
                return middlewares;
            }
        }
    }

有人能帮我把文档翻译成中间件部分的新编写方式吗？

谢谢！！

所以我得到了一些帮助，这就是解决问题的方法：

  livereload: {
    options: {
      open: true,
      middleware: function(connect) {
        var middlewares = [require('grunt-connect-proxy/lib/utils').proxyRequest];
        return middlewares.concat(
          connect.static('.tmp'),
          connect().use('/bower_components', connect.static('./bower_components')),
          connect().use('/app/styles', connect.static('./app/styles')),
          connect.static(appConfig.app)
        );
      }
    }
  }

希望这也能帮助其他人。

相关文章：