在角度 6 中使用 slick.js 时出错答案

【问题标题】：error using slick.js in angular 6在角度 6 中使用 slick.js 时出错
【发布时间】：2018-08-14 02:53:11
【问题描述】：

我正在尝试使用 slick.js 一个旋转木马框架。

我尝试了 `npm install slick --save' 并将下载的文件添加到我的脚本和样式 json 对象中。

那没有用，所以我在我的 angular index.html 文件中导入了 css 和 js：

<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
  <link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
  <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
  <script type="text/javascript" src="slick/slick.min.js"></script>
</body>

然后我通过执行安装 jquery 类型

npm install typings/jquery --save-dev

然后在相关的 ts 文件中我使用 slick 并导入 jquery

import * as jQuery from 'jquery';
...

ngOnInit(){
jQuery<any>('cuisinecarousel').slick({
      centerMode: true,
      centerPadding: '60px',
      slidesToShow: 3,
      responsive: [
        {
          breakpoint: 768,
          settings: {
            arrows: false,
            centerMode: true,
            centerPadding: '40px',
            slidesToShow: 3
          }
        },
        {
          breakpoint: 480,
          settings: {
            arrows: false,
            centerMode: true,
            centerPadding: '40px',
            slidesToShow: 1
          }
        }
      ]

    });
...
}

然后我得到这个错误：

ERROR in mainroot/venuepage/venuepage.component.ts(451,36): error TS2551: Property 'slick' does not exist on type 'JQuery<any>'. Did you mean 'click'?

谁有类似的问题，如何解决？

格拉茨

我发现了这个：去试试看它是否修复

https://github.com/devmark/ngx-slick

【问题讨论】：

标签： javascript jquery angular slick.js

【解决方案1】：

尝试使用：

declare var $: any;

代替：

import * as jQuery from 'jquery';

【讨论】：