angular - 如何在 Angular 2+ 项目中包含 Vivus Javascript
问题描述
我有一个 Angular 6 项目,我想要 SVG 动画。
Vivus 是一个我想引入的 JavaScript 类。
第一步显然是在项目文件夹中运行“npm install vivus”。
我猜在那之后我需要在我的 app.module.ts 文件中添加这样的内容:“import * as Vivus from 'Vivus';” 和我的导入数组中的“Vivus”。
我需要采取哪些步骤才能在我的 Angular 项目中包含 Vivus SVG 动画?
解决方案
我通过执行以下步骤解决了这个问题:
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)vivus
在类中添加ngAfterViewInit
:
ngAfterViewInit() {
const hi = new vivus('animateWeb', {type: 'sync', duration: 300, start: 'autostart', dashGap: 2, forceRender: false},);<br >
}
推荐阅读
- html - 使用具有最大宽度的 React 创建一个图像库,一旦屏幕宽度小于最大宽度,它就会变小
- spring - Spring Boot JSON 配置返回 null
- javascript - 如何将 code.gs 中的变量添加到 Audio src?
- c# - ASP.NET CORE 5.0 Identity 显示当前登录用户
- python - 在 pandas 中使用 for 循环创建新列
- php - MySQL检查大量数据
- python-3.x - LazyDocs - 生成的 *.md 文件不代表项目符号列表
- php - 调用未定义的方法 Illuminate\Database\Query\Builder::with() - Larvel
- selenium - 我们如何在 jmeter 中对 selenoid 运行 Selenium 测试?
- python - 为什么 Python 不喜欢与成员变量进行比较?