angular - 如何在 Angular 2+ 项目中包含 Vivus Javascript

Question

我有一个 Angular 6 项目，我想要 SVG 动画。

Vivus 是一个我想包含的 JavaScript 类。

第一步显然是在项目文件夹内运行“npm install vivus”。

我猜测之后我需要在我的 app.module.ts 文件中添加类似的内容:“import * as Vivus from 'Vivus';”和我的导入数组中的“Vivus”。

我需要采取哪些步骤才能将 Vivus SVG 动画包含在我的 Angular 项目中？

Answer 1

我通过执行以下步骤解决了该问题:

1) npm i -S vivus 和 npm i -D @types/vivus

2) 打开 angular.json 文件并将以下值添加到脚本数组中:"node_modules/vivus/dist/vivus.js"

3) 在您的组件中添加以下行:import * as vivus from 'vivus';

5) 在ngAfterViewInit中的类中添加vivus:

ngAfterViewInit() {
    const hi = new vivus('animateWeb', {type: 'sync', duration: 300, start: 'autostart', dashGap: 2, forceRender: false},);<br >
}