programing

angular-cli 도구의 --base-href 매개 변수와 --deploy-url 매개 변수의 차이점은 무엇입니까?

skycolor 2023. 5. 7. 11:20
반응형

angular-cli 도구의 --base-href 매개 변수와 --deploy-url 매개 변수의 차이점은 무엇입니까?

사용해야 하는 Angular 정보의 문서화--base-href서브폴더에 배포될 때 프로덕션용 Angular 응용 프로그램 빌드의 매개 변수:

파일을 서버 하위 폴더에 복사하는 경우 빌드 플래그를 추가합니다.--base-href설정합니다.<base href>적당하게.

예를 들어, 다음과 같은 경우index.html의 서버에 있습니다./my/app/index.html기본 href를 로 설정합니다.<base href="/my/app/">이것처럼.

https://angular.io/guide/deployment

그러나 각-cli는 다음을 갖습니다.--deploy-url매개 변수이 도구의 설명서에는 다음과 같이 설명되어 있습니다.

파일이 배포될 URL입니다.

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

사용하는 솔루션을 본 적이 솔루션은 있습니다.--deploy-url대신에--base-href응용 프로그램이 하위 폴더에 배포될 시기.

그 질문은

사이에 무슨 차이가 있습니까?--base-href그리고.--deploy-url각도-cli 도구의 매개 변수?제가 각각 언제 사용해야 하나요?

  • 라우팅에서 기본 href를 사용하고 있습니다.
  • deploy-url은 자산용입니다.

대부분의 경우 base-href로 충분합니다.

다음 게시물을 참조하십시오.

스크립트를 "/test/app1/script/" 폴더에 넣으려면 다음 명령을 사용합니다.

ng build --prod --base-href /test/app1/ --deploy-url /test/app1/script/

따라서 제 앱은 https://example.com/test/app1/ 에서 액세스할 수 있지만 JS 스크립트와 CSS는 https://example.com/test/app1/script/ 디렉토리에 있습니다.

사용할 경우/users라우터에 대한 애플리케이션 기반으로 사용됩니다./public내 자산의 기반으로서,

ng build --prod --base-href /users/ --deploy-url /public 

자세한 예는 셰카르 굴라티의 블로그를 참조하십시오.

여기서의 답은 완전히 정확하지 않고, 구식이며, 완전한 설명을 제공하지 않습니다.

제가 각각 언제 사용해야 하나요?

tl;dr 일반적인 용도--base-href,왜냐면--deploy-url

  1. Angular v13에서 더 이상 사용되지 않습니다.
  2. 빌드 속도가 감소합니다(단, 그다지 중요하지 않을 수도 있음).
  3. 의 이점이 없습니다.base href"관련 템플릿(HTML) 자산 관련 fetch/XMLHttpRequests를 찾습니다."

URL이 자산이 배치된 위치와 달라야 할 경우 공식 문서는 설정을 권장합니다.APP_BASE_HREF수동(및 다르게 설정)(예: set)--base-href로./public/그리고.APP_BASED_HREF로./users/https://example.com/public/ 에서 Angular 파일을 제공하지만 웹 앱의 URL이 https://example.com/users/) 이 되기를 원한다면,

사이에 무슨 차이가 있습니까?--base-href그리고.--deploy-url각도-cli 도구의 매개 변수?

위에 이미 세 가지 차이점을 열거했습니다.

질문에 이미 언급했듯이,--base-href설정합니다.<base href>에 시대에index.html(자세한 내용은 Mozilla 문서 참조 및 시사점은 커뮤니티 위키 참조),--deploy-url 상링붙 다습니앞 의 관련 링크 를 붙입니다.index.htmljava.

를 들어,과 같은 예들어같, 과습니다다음를▁the▁for.index.html코드 조각:

<link rel="stylesheet" href="styles.HASH.css">
...
<script src="main.HASH.js" type="module"></script>

와 함께--deploy-url /public/다음과 같이 출력됩니다.

<link rel="stylesheet" href="/public/styles.HASH.css">
...
<script src="/public/main.HASH.js" type="module"></script>

--deploy-url말 그대로 링크 앞에 접두사를 붙이는 것처럼 보여서 만약 당신이 그랬겠죠.--deploy-url public출력은 거의 사용할 수 없습니다.

<link rel="stylesheet" href="publicstyles.HASH.css">
...
<script src="publicmain.HASH.js" type="module"></script>

하는 템플릿(HTML이 있는 를 들어 a 막지으로자대상링산한사템이(HTML) 경우예를, 들어있는.header.component.html을 포함하는<img src="assets/logo.jpg">하지만 당신은 사용합니다.--deploy-url /public/링크는 접두사로 지정되지 않으며 손상된 이미지를 제공합니다.이것은 대신 다음과 같은 경우에 작동합니다.<base href="/public/">를 사용하여 설정됩니다.--base-href /public/.

Angular v12에서 Angular v14로 마이그레이션:

v12 이전 버전

index.dll:

<base href="/">  // overriden by angular.json

꾸러미json:

"start": "ng serve --base-href=/my-app/"  // obsolete

v14 이후

각진.json:

"baseHref": "/"  // used for finding .js files

app.vmdk.ts:

providers: [{ provide: APP_BASE_HREF, useValue: '/my-app/' },  // used for routing

지정"deployUrl"앵귤러.json은 나를 위해 일하지 않았습니다.

언급URL : https://stackoverflow.com/questions/51182322/whats-the-difference-between-base-href-and-deploy-url-parameters-of-angular

반응형