Angular ng build—prod非导出函数

我是Angular的初学者。 编译器说我在文件中有一个方法错误，该错误负责组件之间的动画。 我不太明白是什么问题

在寻找问题的解决方案时，我发现有必要为动画的每个状态添加一个“可选”。 我补充说，这没有帮助

设置路线动画

export const animateRoutes=
  trigger('routeAnimations', [
    transition('webDesign => graphicDesign', slideTo('left') ),
    transition('graphicDesign => webDesign', slideTo('right') ),

    transition('webDesign => webProject', slideTo('right') ),
    transition('webProject => webDesign', slideTo('left') ),

    transition('graphicDesign => graphicProject', slideTo('right') ),
    transition('graphicProject => graphicDesign', slideTo('left') ),

    transition('webProject => graphicDesign', slideTo('left') ),
    transition('graphicProject => webDesign', slideTo('left') ),

    transition('* => *', fadeIn() )
  ]);

幻灯片动画

function slideTo(direction) {
  const optional = { optional: true };
  return [
    query(':enter, :leave', [
      style({
        position: 'absolute',
        top: 0,
        [direction]: 0,
        width: '100%',
      })
    ], optional),
    query(':enter', [
      style({ [direction]: '-100%'})
    ],optional),
    group([
      query(':leave', [
        animate('800ms ease-in-out', style({ [direction]: '100%'}))
      ], optional),
      query(':enter', [
        animate('800ms ease-in-out', style({ [direction]: '0%'}))
      ],optional)
    ]),
  ];
}

function fadeIn() {
    const optional = { optional: true };
    return [
      query(':enter, :leave', [
        style({
          position: 'absolute',
          top: 0,
          left: 0,
          width: '100%'
        })
      ], optional),
      query(':enter', [
        style({ opacity: 0 })
      ],optional),
      group([
        query(':leave', [
          animate('600ms linear', style({ opacity: 0 }))
        ], optional),
        query(':enter', [
          animate('600ms linear', style({ opacity: 1 }))
        ],optional)
      ]),
    ];
  }

法登动画

function slideTo(direction) {
  const optional = { optional: true };
  return [
    query(':enter, :leave', [
      style({
        position: 'absolute',
        top: 0,
        [direction]: 0,
        width: '100%',
      })
    ], optional),
    query(':enter', [
      style({ [direction]: '-100%'})
    ],optional),
    group([
      query(':leave', [
        animate('800ms ease-in-out', style({ [direction]: '100%'}))
      ], optional),
      query(':enter', [
        animate('800ms ease-in-out', style({ [direction]: '0%'}))
      ],optional)
    ]),
  ];
}

function fadeIn() {
    const optional = { optional: true };
    return [
      query(':enter, :leave', [
        style({
          position: 'absolute',
          top: 0,
          left: 0,
          width: '100%'
        })
      ], optional),
      query(':enter', [
        style({ opacity: 0 })
      ],optional),
      group([
        query(':leave', [
          animate('600ms linear', style({ opacity: 0 }))
        ], optional),
        query(':enter', [
          animate('600ms linear', style({ opacity: 1 }))
        ],optional)
      ]),
    ];
  }

app.component.ts： 管线动画： 错误：

---

我找到的解决方案不是在函数中设置动画，而是作为变量。 我在这里找到了这个解决方案：

---

之后一切正常。

有什么错误@对不起，谢谢。。。我刚刚更新了问题并添加了错误图片。错误显示

route animations.ts

文件中存在错误。你能在这里分享该文件中的代码吗？这样其他人就可以查看该文件以确定问题所在there@Sanira谢谢你的评论。我添加了图片，您可以在

stackblitz

或其他内容中重现问题，并在此处添加链接，这样就可以轻松找到解决方案。因为我们可以观察整个代码库并找出位置和原因，这就是为什么这段代码没有编译