使用Docker进行Angular快速入门

由于内部强制性会议安排了Angular的学习,只需要关注安装设置部分。

启动应用程序工作正常!

启动Docker容器

使用 Angular 需要 node: 6.9.x 和 npm 3.x.x,因此使用官方的 node 镜像。后续可以指定,但是要公开端口 4200。将应用程序添加到 /app 目录中。

以本地最新版本的node容器运行,命名为angular-lesson,同时使用4200端口映射,将当前目录挂载到容器的/app目录下。

进入容器内运行以下命令:
docker exec -it angular-lesson bash

移动到/app目录。

转到/app目录

下载Angular CLI

从这里开始按照Angular官方的快速入门方法进行操作。

使用npm全局安装@angular/cli。

需要时间

创建Angular应用程序

创建一个名为”my-app”的新项目

进入我的应用程序的目录

请用ng serve命令启动时设置主机和端口。

编辑 my-app/.angular-cli.json

在defaults中添加serve项目。

在设置端口和主机时,如果使用localhost,无法通过浏览器访问Docker容器,因此需要更改为0.0.0.0。

  "defaults": {
    "serve": {
      "port": 4200,
      "host": "0.0.0.0"
    },
    "styleExt": "css",
    "component": {}
  }

开动

进行 ng serve

在Docker中执行ng serve –open无法打开浏览器,所以只需执行ng serve。

当您在浏览器中访问http://localhost:4200/,会显示”app works!”。

暂时就这样了。

Note: This translation is a colloquial expression commonly used in spoken Chinese.

广告
将在 10 秒后关闭
bannerAds