angular4(2-2)angular腳手架引入第三方類庫(swiper)


歡迎加入前端交流群來py749539640

試了好多方法,npm install 方法失敗了,下載到本地是可以使用的;

將swiper文件放到assets文件下;

項目目錄下:(命令行)

因為ts並不能准確識別js語法,所以需要用ts中的interface接口,將js轉化成ts並暴露出來

npm install @types/swiper --save
npm install @types/swiper --save-dev

備注:--save配置在生產環境;--save-dev配置在開發環境

在index.html文件里引入:

<link rel="stylesheet" type="text/css" href="./assets/css/swiper-3.4.2.min.css" />
  <script type="text/javascript"  src="./assets/js/swiper-3.4.2.min.js"></script>

全局引入swiper

在typings.d.ts文件內 聲明全局的jquery對象。全局的對象一般都放在這里聲明

 

組件內引入swiper

import * as swiper from 'swiper'

 

組件里寫入swiper的代碼結構:

啟動swiper:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM