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 ...
随机推荐
- 【转】iOS多语言本地化(国际化)设置
原文网址:http://www.jianshu.com/p/2b7743ae9c90 讨论的iOS应用中的多语言设置,Ok 一般是两种情况: 1.根据当前设备语言自动切换显示 2.在应用中可进行语言设 ...
- [Java]serialVersionUID的作用
简单来说,Java的序列化机制是通过在运行时判断类的serialVersionUID来验证版本一致性的.在进行反序列化时,JVM会把传来的 字节流中的serialVersionUID与本地相应实体(类 ...
- ubuntu 使用阿里云 apt 源
以下内容来自 https://opsx.alibaba.com/mirror Ubuntu对应的“帮助”信息 修改方式:打开 /et/apt/sources.list 将http://archive. ...
- spring Ioc Aop整合
之前用DWP项目做spring的IOC,xml总是提示有问题,之后改用maven通过. 之后将这一块的内容补充. 仔细考虑一下spring 的IOC是无处不在的,演示Aop也需要依赖spring的IO ...
- BZOJ 2120 带修莫队
思路: 暴力能过的 嘿嘿嘿 我是来练带修莫队的嗯 复杂度 O(n^5/3) //By SiriusRen #include <cmath> #include <cstdio> ...
- 基于nginx的最基础的TCP代理,经过测试可通!
测试操作系统为win7,nginx版本为1.9.4. 在本机上编写java程序一个socket服务类SocketServer,监听端口为8889, (增加了一个SocketServerThread线程 ...
- ifame子页实现父页面刷新(或跳转到指定页面)
<script>parent.location.replace('../D_DailyManager/Add.aspx?id=" + x + "');</scri ...
- Apache2.2伪静态配置
最近由于工作的需要要配置一下Apache的伪静态化,在网上搜了好多都无法完成,所以觉得有必要在这里写一下. 第一步:打开Apache的httpd.conf文件,把LoadModule rewrite_ ...
- luogu P3387 【模板】缩点_拓扑排序
还是很好些的. Code: #include <stack> #include <cstdio> #include <algorithm> #include < ...
- linux C++ 编译错误 file not found 其实是原文件后缀的问题
gcc和clang会根据源文件的后缀.c或者.cpp判断原文件类型,采取不同的编译策略,所以我使用它们编译后缀是.c的C++原文件的时候会出现找不到include的文件的错误,使用正确的后缀名即可.同 ...