Javascript 为什么flickity css没有在Angular中加载？

所以我尝试在我的Angular应用程序中加入旋转木马。我认为从技术上讲，它应该工作得很好，阻止它按应有方式工作的问题是，

flickity.css

中的css似乎没有加载。我希望有人能知道为什么会这样

我通过运行

npm install flickity

将

flickity

添加到我的应用程序中

此后，在我的

组件

中，我添加了

flickity

：

import * as flickity from 'flickity';

接下来，我草签了每件事：

ngOnInit（）{
addEventListener（“DOMContentLoaded”，function（））{
this.carousel=document.querySelector（“.container”）；
console.log（this.carousel）；
this.flick=新的flickity（this.carousel{
想象：是的，
总括：对
});
var imgs=this.carousel.queryselectoral（'.item img'）；
控制台日志（imgs）；
var docStyle=document.documentElement.style；
var transformProp=typeof docStyle.transform=='string'？
“转换”：“WebKittTransform”；
this.flick.on（'scroll'，function（）{
this.flick.slides.forEach（函数（slide，i）{
var-img=imgs[i]；
var x=（slide.target+this.flick.x）*-1/3；
img.style[transformProp]='translateX（'+x+'px'）；
});
});
});
}

您需要像这样将

flickity

css文件添加到angular.json导入中

angular.json

// ...
"styles": [
 // path to flickity css
 // I just made this up so you will have to double check the path to the css file
 "node_modules/flickity/dist/flickity.min.css"
]

请注意：添加此项后，您必须重新启动项目才能使更改生效

或

根据flickity文档，您可以将其包括在内

<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">

---

在

index.html

中，您需要将

flickity

css文件添加到angular.json导入中，如下所示

angular.json

// ...
"styles": [
 // path to flickity css
 // I just made this up so you will have to double check the path to the css file
 "node_modules/flickity/dist/flickity.min.css"
]

请注意：添加此项后，您必须重新启动项目才能使更改生效

或

根据flickity文档，您可以将其包括在内

<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">

在您的

index.html