Angularcli与任何其他

Question

我对Angular 2比较陌生，我正在尝试使用Angular cli系统构建一个应用程序。这行得通，我可以发球，申请就来了。然而，尝试使用ngserve系统之外的任何东西来为应用程序提供服务似乎是一个巨大的痛苦。特别是，我试图为使用angular cli构建的应用程序提供Python Flask应用程序。为了让这件事发挥作用，我似乎不得不跳出很多圈圈，这让我发疯了！我之所以这么做，是因为我想用Python/Flask应用程序提供restapi，它将响应Angular 2应用程序的HTTP服务请求。在

以下是我使用的相关版本：

node - 6.2.2
npm - 2.9.5
angular 2 - rc.4
angular-cli - 1.0.0-beta.9
python - 2.7.5
flask - 0.10.1

如何在使用烧瓶时提供角度应用程序？在

Answer 1

没有要求Flask服务于前端应用程序。在

实际上Flask使用Angular应用程序所要做的就是提供静态文件，这是在生产中由Nginx这样的web服务器处理的，或者在开发中使用像ng这样的框架工具更好地处理。在

同时，Flask将充当前端应用程序与之通信的后端api服务器。使用request.get_json()和return jsonify(...)来获取和响应JSON数据。在

两个单独运行，它们只通过HTTP一起工作。这也简化了与后端开发人员和前端开发人员的工作：他们只需要知道两者之间通信的api。但是，由于前端在与后端不同的端口上提供服务，因此需要适当地设置Flask以允许CORS请求，例如使用Flask CORS。在

Answer 2

老问题，但我在建立新项目时遇到了。我使用的是angular cli（7.3.1）和Flask（1.0.2）的较新版本，但其设置与您的非常相似。我应该注意到，这绝不是最干净的设置，我确信只有webpack才能实现同样的设置，但我觉得这样做比较容易理解（我发现webpack配置可能是个噩梦）。我的目录结构如下（构建后）：

client              // this is my angular project
  src
  angular.json
server              // this is my flask server
  templates
    index.html      // generated from ng build
  static
    vendor.js       // generated from ng build
    pollyfills.js
    ...
Makefile

在角度.json，您需要将构建路径指向烧瓶服务器：

^{pr2}$

在“我的服务器”中，配置静态url:

app = Flask(__name__, static_url_path='')

最后在makefile中，执行build命令，并将模板文件复制到templates文件夹中：

all:
    cd client && ng build  prod;
    mv server/static/index.html server/templates/ ;

.PHONY : all

同样，这不是最优雅的解决方案，而是非常直接地使用角度分明的cli（而不是用webpack弄脏手）。在

Answer 3

实际上我已经解决了这个问题。我有一个名为“smoke”（smoke和mirrors的缩写）的目录，在那里我运行angular cli命令：

ng new static

这在静态目录中创建了angular cli start out应用程序。然后我创建了这个（简化的）Python Flask应用程序：

^{pr2}$

通过这种方式，我可以导航到http://localhost:5000，应用程序将像“ngserve”一样提供角度应用程序。现在，我可以根据需要添加restapi端点，并让Angular服务访问它们来填充应用程序。在

道格