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 ...
随机推荐
- 英语发音规则---F字母
英语发音规则---F字母 一.总结 一句话总结: 1.F/FF发[f]音? fly [flaɪ] vi. 飞 fine [faɪn] adj. 好的 float [fləʊt] vt. 使漂浮 fra ...
- php常用知识集锦
php常用知识集锦 很多位置都有写好的代码,自己做项目的时候可以直接拿来用,而不用自己写,比如现在看到的菜鸟教程. 1.判断是否为空 empty($_POST["name"]) 2 ...
- hdoj--1251--统计难题(字典树)
统计难题 Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 131070/65535 K (Java/Others) Total Subm ...
- kafka windows安装 命令行下使用测试
1.zookeeper安装: (https://zookeeper.apache.org/releases.html) ①进入zookeeper的相关设置所在的文件目录,例如本文的:D:\bigd ...
- 对MySQL交换分区的实践
前言 在介绍交换分区之前,我们先了解一下 mysql 分区. 数据库的分区有两种:水平分区和垂直分区.而MySQL暂时不支持垂直分区,因此接下来说的都是水平分区.水平分区即:以行为单位对表进行分区.比 ...
- Oracle 复合索引设计原理——前缀性和可选性
前缀性: 复合索引的前缀性是指只有当复合索引的第一个字段出现在SQL语句的谓词条件中时,该索引才会被用到.如复合索引为(ename,job,mgr),只要谓词条件中出现第一个字段ename,就可以用复 ...
- struts2学习之基础笔记6
第十一章 Struts 2的国际化 1 国际化简介 http协议,request_locale值 Locale类àà封装类request_locale值 ResourcesBandleàà ...
- hdu 1754 I Hate It【线段树】
维护一个最大值 #include<cstdio> #include<cstring> #include<iostream> #include<algorith ...
- 产品开发也要看阵容,APP开发只需五步变得靠谱
最早认识的一个朋友是程序员,曾经到一家外包公司接单子,小外包公司经常遇到的问题就是和需求方谈产品功能.客户要做外包,对方让他一次性报价,但是客户连功能点自己都不清楚,这时朋友说还是按照具体功能点来做吧 ...
- Web API Filter
在Web Api中,有三种Filter Filter类型 实现的接口 描述 Authorization IAuthorizationFilter 最先运行的Filter,被用作请求权限校验 Actio ...