简体   繁体   English

如何在 codeanywhere IDE 中预览 angular 应用程序?

[英]How to preview angular app in codeanywhere IDE?

While running angular apps in codeanywhere or cloud9 , we can not preview the compiled angular or any other web apps.codeanywherecloud9中运行 angular 应用程序时,我们无法预览已编译的 angular 或任何其他 web 应用程序。 We're getting blank screen or some error message.我们收到空白屏幕或一些错误消息。

To preview it, we have to do the following checks要预览它,我们必须进行以下检查

  1. Please Check that your Container is turned on and running请检查您的容器是否已打开并正在运行
  2. Please ensure that your server(angular) is running and listening on 0.0.0.0 IP address.请确保您的服务器(角度)正在运行并listening on 0.0.0.0 IP 地址。 ( If you're listening on 127.0.0.1 (localhost), then it is not available from outside of the Container ) 如果您在 127.0.0.1 (localhost) 上收听,那么它在 Container 外部不可用
  3. Your server might be running on different port, please check you are using the right port.您的服务器可能在不同的端口上运行,请检查您使用的端口是否正确。

And please use this below command to ensure these all above said points are matched to compile angular app.请使用以下命令确保上述所有点都匹配以编译 angular 应用程序。

ng serve --host 0.0.0.0 --port 4201 --disable-host-check

here port number 4201 is of my choice, please feel free to choose your own.这里端口号 4201 是我的选择,请随意选择。

Now the codeanywhere IDE is ready to be viewed outside.现在codeanywhere IDE 已准备好在外面查看。 And in some cases, you may not get the preview url to view the app in the browser.在某些情况下,您可能无法获得预览 url 以在浏览器中查看应用程序。 If so, we've to find the preview url.如果是这样,我们必须找到预览版 url。 Let's see how to construct it below:让我们看看如何在下面构建它:

https://port-4201-containerName-username.preview.codeanywhere.com/

Please replace the below mentioned keyword by your own, according to your IDE请根据您的 IDE 自行替换下面提到的关键字

  • 4201 is your port number 4201是你的端口号
  • containerName is the name of your container(project environment) containerName是您的容器的名称(项目环境)
  • username is the codeanywhere username用户名是codeanywhere用户名

This is not only for angular and applicable for all the web apps. Angular is an example here.

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Angular-CodeAnywhere-您似乎不依赖于“ @ angular / core”。 这是一个错误 - Angular - CodeAnywhere - You seem to not be depending on “@angular/core”. This is an error 如何在 ubuntu 中安装 Angular IDE? - How to install Angular IDE in ubuntu? 如何使用 IntelliJ IDE 在我的应用程序中查看/查找 angular 组件的数量? - How can i see/find the number of angular components in my app, with IntelliJ IDE? 如何以角度预览上传的任何类型的文件? - How to preview the uploaded any kind of file in angular? 如何使用角度 4/5/6 显示文件预览? - How to show file preview using angular 4/5/6? Angular2 - 如何启动和使用哪个IDE - Angular2 - how to start and with which IDE 如何使用 Angular 显示所选图像的预览 - How to display preview of the selected image using Angular 将angular 4应用程序部署到我的ftp Pagespeed Insight空白预览 - deploy angular 4 app to my ftp pagespeed insight blank preview 如何在 Angular 应用程序中使用 base64 格式预览具有不同格式的文件,例如 .docx、.pdf、.xlsx? - How to preview files having different formats like .docx, .pdf, .xlsx using its base64 format in Angular app? 如何使用Angular 8预览项目中的静态文件? - How to preview a static file in my project using Angular 8?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM