Angular 5.1 & CLI 1.6 릴리즈

스키머(schemr)
Dec 10, 2017 · 5 min read

Angular 5.1.0 버전과 Angular CLI 1.6.0 정식 버전이 릴리즈 되었습니다. 그리고 Angular Material과 CDK 도 첫번째 정식버전이 릴리즈 되었습니다.(2017.12.7)

각 릴리즈 내용에 대해서 간단히 정리했습니다.

공식 홈페이지

Angular 5.1.0

animation 과 service-worker 에 대한 버그픽스가 릴리즈 되었습니다.()

  • animations: ensure DOM is cleaned up after multiple leave animations finish
  • service-worker: initialize in browser only
  • service-worker: esm2015 points to wrong path

Angular CLI 1.6.0

Service Worker / Universal / App Shell 지원이 추가되었습니다.

Service Worker

Angular 5.0.0 에서 추가된 Service Worker 를 지원합니다.

ng new <project-name> --service-worker

Angular Sevice Worker의 자세한 내용은 를 참고하세요.

서버사이드 렌더링을 위한 명령어가 추가되었습니다.

ng generate universal <name>ng build --app=<name>

generate 실행시 자동으로 package.json, .angular-cli.json, main.ts, app.module.ts 파일에 Universal 을 위한 코드가 업데이트 되며, app.server.module.ts, main.server.ts, tsconfig.server.json 파일이 생성됩니다.

Angular CLI Universal

기존에 필요했던 과정들중 일부를 자동으로 처리해줍니다. (, Step 4 부터 시작하면 됩니다.)

App Shell

App Shell 은 인터페이스를 구성하는 최소한의 HTML, CSS, JS 를 의미하며, 어플리케이션의 초기 구동 성능을 향상시켜 사용자에게 좋은 경험을 제공합니다. App Shell 은 라우터가 필수입니다.

ng new <project-name> --routingng generate app-shell [ --universal-app <universal-app-name>] [ --route <route>]

자세한 내용은 다음 링크를 참고하세요.

&

Angular Material 은 2.0.0 알파버전을 시작으로 Sem Ver 정책에 맞춰서 첫 정식버전이 5.0.0 으로 릴리즈 되었습니다. Angular CDK(Component Dev Kit) 역시 5.0.0 정식버전으로 재사용 가능한 컴포넌트를 활용할 수 있습니다.

npm install --save @angular/material @angular/cdk

설치 및 사용에 관해서는 를 참고해주세요.

에러 메세지의 변경

공식블로그에서 제시한 예시를 살펴보면 템플릿을 함수의 호출을 통해서 생성하려고 할때 에러가 발생하는데 발생한 위치와 내용을 더 쉽게 확인할 수 있습니다.

// components.ts@Component({  
template: genTemplate()
})
export class MyComponent {}

기존 에러 메시지

Error encountered resolving symbol values statically. Calling function ‘genTemplate’, function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol MyComponent in components.ts, resolving symbol MyComponent in components.ts

변경된 에러 메시지

component.ts(9,16): Error during template compile of 'MyComponent'.
Function calls are not supported in decorators but 'genTemplate' was called.

TypeScript 2.5 지원

Angular 5 버전에서는 기본적으로 TypeScript 2.4 를 지원하고 있으며 선택적으로 2.5 버전을 사용할 수 있습니다.

npm install typescript@'~2.5.3'

2.6버전에 대해서도 차후 마이너 릴리즈를 통해서 지원 예정이라고 합니다.


이번 릴리즈에 대한 내용은 Angular Blog 에 자세히 포스팅 되어 있습니다.

Angular Blog :

Witinweb

웹을 이해하고 웹에 wit를 불어넣는 놀이터

스키머(schemr)

Written by

행복한 프론트엔드 개발자

Witinweb

Witinweb

웹을 이해하고 웹에 wit를 불어넣는 놀이터