angular4(2-2)angular脚手架引入第三方类库(swiper)
试了好多方法,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:

angular4(2-2)angular脚手架引入第三方类库(swiper)的更多相关文章
- angular4(2-1)angular脚手架引入第三方类库(jquery)
欢迎加入前端交流群交流知识&&获取视频资料:749539640 如何在angular4脚手架中引入第三方类库呢比如jquery.swiper.bootstrap...... 例如引入j ...
- Laravel Controller中引入第三方类库
Laravel 引入第三方类库 在Controller中引入自定义的php文件,先在app目录下创建一个新的文件夹,命名Tools(可自定义),接着创建一个MyTest.php: <?php c ...
- TP3.2之引入第三方类库文件和普通.php文件
1.引入第三方类库 .class.php文件 1.1 类库有写namespace命名空间 namespace Org\Util; class Auth { } 保存到ThinkPHP/Library/ ...
- laravel5.3引入第三方类库的方法
laravel版本:5.3 今天做的是引入第三方的phpquery类库,方法: 在laravel的app目录下自定义一个文件夹,我用的名字是:Libs 然后直接将phpquery类库扔进这个目录 在c ...
- TP5 中引入第三方类库
通过了解tp5的目录结构,我们知道其中有两个目录是纺织扩展类库文件的. extend是放置自定义或者其他类文件的. vendor目录是放置composer类库文件的. 当我们的第三方类库文件是下载的, ...
- thinkphp 3.2,引入第三方类库的粗略记录
首先用第三方类库我是放到vendor里面的 根目录\ThinkPHP\Library\Vendor\Wxphp 例如创建了一个Wxphp文件夹,里面有个php文件叫做 zll.php 文 ...
- Laravel 引入第三方类库及自定义函数
1.新建一个目录放第三方类库 2.找到composer.json文件打开,在里面autoload 下classmap下面加入类库路径 3根目录下运行composer dumpautoload 4.使用 ...
- android studio 引入第三方类库jar包
第三方类库jar包 这就简单多了,直接将jar包拷贝到app/libs下,然后在app下的build.gradle中添加此jar的依赖.如下: dependencies { compile 'com. ...
- iOS开发引入第三方类库的问题
在开发iOS程序的过程中,通常在导入第三方的类库(.a/.o)文件会报出一系列的错误: Undefined symbols for architecture i386: "std::stri ...
随机推荐
- HMM XSS检测
HMM XSS检测 转自:http://www.freebuf.com/articles/web/133909.html 前言 上篇我们介绍了HMM的基本原理以及常见的基于参数的异常检测实现,这次我们 ...
- Java-MyBatis-杂项:MyBatis根据数组、集合查询
ylbtech-Java-MyBatis-杂项:MyBatis根据数组.集合查询 1.返回顶部 1. foreach的主要用在构建in条件中,它可以在SQL语句中进行迭代一个集合.foreach元素的 ...
- [JavaEE]Hibernate 所有缓存机制详解
Hibernate提供的一级缓存 hibernate是一个线程对应一个session,一个线程可以看成一个用户.也就是说session级缓存(一级缓存)只能给一个线程用,别的线程用不了,一级缓存就是和 ...
- 更改python字符编码以便使用UTF-8的编码url路径
url编码分两种, 一种是unicode, 另一种是gb2312, 今天遇到的一个网站是要将字符编码按照gb2312来编码,用来得到一个先填写blanks后再返回页面的数据,废话少说,需要做的就是先查 ...
- Java Servlet 配置
图片太大,可以右键另存再查看,也可以鼠标点击拖置一下,用浏览器单独承载放大查看.
- redis的持久化功能
基于快照持久化 修改配置文件,开始基于快照的选项 [root@localhostbin]#vim /etc/redis/redis.conf stop-writes-on-bgsave-error y ...
- 洛谷P4014 分配问题(费用流)
题目描述 有 nn 件工作要分配给 nn 个人做.第 ii 个人做第 jj 件工作产生的效益为 c_{ij}cij .试设计一个将 nn 件工作分配给 nn 个人做的分配方案,使产生的总效益最大. ...
- Stack Overflow大揭密:哪一种程序员工资最高?
Stackoverflow在程序员之间可以說是无人不知无人不晓,甚至常有人开玩笑说:“如果stackoverflow倒闭了,全世界代码的产出率将下降一半以上”或许听起来有点夸张,但是不难想像这个网站在 ...
- JWT加密
JWT是一种加密算法,为了防止请求的信息在传输途中被拦截修改 JWT的引用: install-package jwt JWF由三部分组成:Header,Payload,Signature Payloa ...
- 获取浏览器端的cookie方法
代码如下: function getCookie(key){ var cookies=document.cookie; if(cookies.length>0){ var start=cooki ...