在 codeanywhere 上使用 angularjs-cli 构建 angularjs 2

Posted 2023-03-07

【中文标题】在 codeanywhere 上使用 angularjs-cli 构建 angularjs 2

【英文标题】：build angularjs 2 with angularjs-cli on codeanywhere

【发布时间】：2017-12-15 01:14:05

【问题描述】：

当我尝试通过 ng serve --host 0.0.0.0 为我的应用程序提供服务时，我遇到了无效的主机头问题。我尝试了以下方法。 1.安装-g angular-cli 2. cd 到那个应用程序目录 3. 更改 angular-cli.json 中的端口

"defaults": 
    "styleExt": "css",
    "component": ,
    "serve": 
              "port": 1337
             
  

ng 服务 --host 0.0.0.0

浏览器中请求的网址是http://port-1337.angular2-jobproject0889272.codeanyapp.com/

【参考方案1】：

我正在寻求解决一个不同的问题，并找到了一个可能对你有用的答案。

ng serve --port 8080 --host 0.0.0.0 --disableHostCheck true

Angular-cli GitHub

【讨论】：

您能否详细说明一下您认为这是解决方案的原因以及您提供的链接背后的内容？

【参考方案2】：

如果我对您的问题的理解正确，那么您的问题可能源于 Webpack 的安全实现。 由于 Angular CLI 默认使用 Webpack 来捆绑您的应用程序，因此在使用“ng serve”时您必须遵守其要求。 Webpack 生成的应用程序包现在要求请求的 Host 标头与侦听地址或 public 选项中提供的主机匹配。

public 选项 是通过“ng serve”命令传递的 --public 标志。在 CodeAnywhere 上，您很可能还应该注意指明端口号。一个有效的“ng serve”命令可能如下所示： $ ng serve --host 0.0.0.0 --port 3000 --public myproject-myusername.codeanyapp.com

（对于 HTTPS 服务，CodeAnywhere 要求您使用端口 3000）

您可以在 CodeAnywhere IDE 中找到 --public 标志的特定值，方法是右键单击项目的树视图连接图标并选择“信息”选项。

为了简化操作，您可以在 package.json 文件中进行设置，然后使用以下命令启动 Angular 服务器： $ npm start

例如，您可以修改 package.json “scripts”条目的“start”元素，如下所示： "scripts": "ng": "ng", "start": "ng serve --host 0.0.0.0 --port 3000 --public myproject-myusername.codeanyapp.com"

希望此信息适用于您面临的问题。祝你好运！

【讨论】：

正确的启动命令是：ng serve --host 0.0.0.0 --port 3000 --public-host myproject-myusername.codeanyapp.com