Angular 2 --aot导致AnimationEntryMetadata失败

时间:2016-11-21 03:22:48

标签: angular typescript

我的代码适用于ng buildng build --prod howerver,当我添加--aot到命令时,它失败并出现以下错误:

Uncaught Error: Module build failed: Error: C:/Users/dremache/Code/control-f2/client/src/app/transitions.ts (11,14): Exported variable 'pageTransitions' has or is using name 'AnimationEntryMetadata' from external module "C:/Users/dremache/Code/control-f2/client/node_modules/@angular/core/src/animation/metadata" but cannot be named.)

这是 transitions.ts

import { trigger,
  state,
  style,
  transition,
  animate,
  keyframes } from '@angular/core';


export const pageTransitions = 

  trigger('slideInOut', [

    state('in', style({transform: 'translateX(0)'})),

    transition('void => *', [
      style({transform: 'translateX(-60px)',opacity: '0'}),
      animate('300ms ease-out')
    ]),
    transition('* => void', [
      animate('300ms ease-out', style({transform: 'translateX(-60px)'}))
    ])
  ]);

这是导入它的组件:

//other imports
import { pageTransitions } from './transitions';

@Component({
  //other properties
  animations: [ pageTransitions, 

      trigger('items', [
         // states and transitions here.. removing for cleanliness
      ]
  })

有什么想法吗?我这样做是为了避免重新定义相同的动画。这些动画应用于从void => *开始创建页面过渡动画的组件。

1 个答案:

答案 0 :(得分:7)

修正了它!

在我的transitions.ts文件中,我需要更改:

export const pageTransitions = 

为:

export const pageTransitions: AnimationEntryMetadata = 

(以及从AnimationEntryMetadata导入@angular/core