구성 파일에서 ng serve의 기본 호스트 및 포트 설정

구성 파일에서 호스트와 포트를 설정할 수 있는지 알고 싶으므로 입력하지 않아도됩니다.

ng serve --host foo.bar --port 80

그냥 대신

ng serve

앵귤러 CLI 6+

각도의 최신 버전이이 설정됩니다 설정 파일 . 예:angular.json

{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "projects": {
        "my-project": {
            "architect": {
                "serve": {
                    "options": {
                        "port": 4444
                    }
                }
            }
        }
    }
}

값을 보거나 편집 하는ng config 데 사용할 수도 있습니다 .

ng config projects["my-project"].architect["serve"].options {port:4444}

앵귤러 CLI <6

이전 버전에서는이 요소 아래 에 설정되었습니다angular-cli.jsondefaults .

{
  "defaults": {
    "serve": {
      "port": 4444,
      "host": "10.1.2.3"
    }
  }
}

지금 당장 그 기능은 지원되지 않지만 이것이 당신을 대체하는 것을 방해하는 것이라면 package.json에있을 것입니다 ...

"scripts": {
  "start": "ng serve --host foo.bar --port 80"
}

이렇게하면 간단하게 실행할 수 있습니다 npm start

여러 프로젝트 에서이 작업을 수행하려는 또 다른 옵션은 별칭을 만드는 것입니다.이 별칭 ngserve은 위의 명령을 실행할 이름 을 지정할 수 있습니다 .

두 가지 명령 줄 옵션을 사용하여 기본 HTTP 포트와 LiveReload 서버에서 사용하는 포트를 구성 할 수 있습니다.

ng serve --host 0.0.0.0 --port 4201 --live-reload-port 49153

https://github.com/angular/angular-cli

최신 Angular CLI에서 변경되었습니다.

파일 이름이으로 변경되었으며 angular.json구조도 변경되었습니다.

이것이 당신이해야 할 일입니다.

"projects": {
    "project-name": {
        ...
        "architect": {
            "serve": {
                "options": {
                  "host": "foo.bar",
                  "port": 80
                }
            }
        }
        ...
    }
}

또 다른 옵션은 다음 ng serve과 같은 --port옵션으로 명령 을 실행 하는 것입니다.

ng serve --port 5050 (즉, 포트 5050의 경우)

또는, 명령 ng serve --port 0은 사용 가능한 포트를 자동으로 할당합니다.

Angular에서 기본 포트 번호를 변경하는 두 가지 방법이 있습니다.

첫 번째 방법은 CLI 명령입니다.

ng serve --port 2400 --open

두 번째 방법은 위치에서 구성하는 것입니다.

ProjectName\node_modules\@angular-devkit\build-angular\src\dev-server\schema.json.

schema.json 파일을 변경하십시오.

{
 "title": "Dev Server Target",
  "description": "Dev Server target options for Build Facade.",
  "type": "object",
  "properties": {
    "browserTarget": {
      "type": "string",
      "description": "Target to serve."
    },
    "port": {
      "type": "number",
      "description": "Port to listen on.",
      "default": 2400
    },

이것들을 파일로 저장할 수는 있지만 .ember-cli(적어도 적어도) 파일을 넣어야합니다 . 참조 https://github.com/angular/angular-cli/issues/1156#issuecomment-227412924를

{
"port": 4201,
"liveReload": true,
"host": "dev.domain.org",
"live-reload-port": 49153
}

편집 : 이제 커밋 https://github.com/angular/angular-cli/commit/da255b0808dcbe2f9da62086baec98dacc4b7ec9 의 angular-cli.json 에서 빌드 1.0.0-beta.30에 설정할 수 있습니다

사용자 정의 호스트 / IP 및 포트 에서 각도 프로젝트 를 실행 하려는 경우 구성 파일 을 변경할 필요가 없습니다.

다음 명령이 나를 위해 일했습니다.

ng serve --host aaa.bbb.ccc.ddd --port xxxx

어디,

aaa.bbb.ccc.ddd --> IP you want to run the project
xxx --> Port you want to run the project

예

ng serve --host 192.168.322.144 --port 6300

나를위한 결과는

창문에 있다면 다음과 같이 할 수 있습니다.

1. 프로젝트 루트 디렉토리에서 파일 run.bat 작성
2. 이 파일에서 선택한 구성으로 명령을 추가하십시오. 예를 들어

ng serve --host 192.168.1.2 --open

3. 이제 봉사하고 싶을 때마다이 파일을 클릭하여 열 수 있습니다.

이것은 표준적인 방법은 아니지만 사용하기에 편안합니다 (느낌).

다음은 package.json에 넣은 것입니다 (각도 6 실행).

{
  "name": "local-weather-app",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --port 5000",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },

그러면 일반 npm start가 시작 내용을 가져옵니다. 내용에 다른 옵션을 추가 할 수도 있습니다

여기에 이미지 설명을 입력하십시오

당신이해야 할 단 하나. 명령 프롬프트에 이것을 입력하십시오 : ng serve --port 4021 [또는 다른 포트를 지정하십시오 : 5050, 5051 등]. 파일을 변경할 필요가 없습니다.

ng serve를 실행할 때 로컬 IP 주소를 구체적으로 열려면 다음을 수행하십시오.

npm install internal-ip-cli --save
ng serve --open --host $(./node_modules/.bin/internal-ip --ipv4)