先要npm下来zepto:npm install zepto

然后npm下来exports-loader和script-loader

配置如下:

JavaScript

// webpack.config
{
// ...
module: {
loaders: [{
test: require.resolve('zepto'),
loader: 'exports-loader?window.Zepto!script-loader'
}]
}
}

这样我们在页面入口文件中就可以这么写:

JavaScript

// entry.js
import $ from 'zepto' $(function () {
// ...
})
引入成功后,会解决"$ is not defined"的问题
------------------------------------分割线-----------------------------------------
但是tap事件是触发不了的,因为zepto没有继承touch.js,在node_moudules文件夹中看npm下来的zepto,在src文件夹下游touch.js文件,正是我们需要的,现在就想办法把这个js引入就可以了。
想法有两个:
  1,重新打包zepto.js,将touch.js打包到zepto.js中,这是我的思路,但是我并不知道怎么来实现,于是想了个办法,吧touch.js文件中的代码拷贝到/dist/zepto.js的代码的最后,即可。
  2,将touch.js引入到entry.js,require('../node_modules/zepto/src/touch.js'),这句代码要写在引入zepto的下面,即可。

webpack学习笔记——项目引入zepto及tap事件失效的解决的更多相关文章

  1. zepto之tap事件点透问题分析及解决方案

    点透现象出现的场景: 当A/B两个层上下z轴重叠,上层的A点击后消失或移开(这一点很重要),并且B元素本身有默认click事件(如a标签)或绑定了click事件.在这种情况下,点击A/B重叠的部分,就 ...

  2. zepto的tap事件的穿透分析

    首先是什么情况下会发生zepto(tap)的事件穿透: 当一个弹出层用tap点击之后这个层隐藏或者是移走,都会触发下面对应位置的点击事件(click)和一些标签的默认行为(a标签的跳转.input获取 ...

  3. muduo网络库学习笔记(四) 通过eventfd实现的事件通知机制

    目录 muduo网络库学习笔记(四) 通过eventfd实现的事件通知机制 eventfd的使用 eventfd系统函数 使用示例 EventLoop对eventfd的封装 工作时序 runInLoo ...

  4. Python3+Selenium3+webdriver学习笔记14(等待判断 鼠标事件 )

    !/usr/bin/env python -*- coding:utf-8 -*-'''Selenium3+webdriver学习笔记14(等待判断 鼠标事件 )'''from selenium im ...

  5. 【原】webpack学习笔记

    之前在react的项目中有用过webpack,不过没有认真的去研究,这段时间又重新好好的学习一下webpack,发觉 webpack是一个很强大的东西.而且很好用,方便,接下来主要是做一下学习的笔记 ...

  6. Webpack学习笔记九 webpack优化总结

    webpack 优化笔记 webpack4 自带的优化包括 swingTree(摇摆树)和作用域提升 swingTree 比如入口文件 index.js引入通用方法 util, 里面有 10个方法, ...

  7. 更博不能忘——webpack学习笔记

    webpack是前端构建系统就像grunt和gulp(之前有学习过grunt所以也就大概明白webpack是个什么东西),所以说前端技术大部分还真是相通的,现在觉得当时多看的东西并不白费,虽然长时间不 ...

  8. webpack学习笔记

    1.安装webpack npm install webpack -g 2.进入项目目录,初始化 npm init 3.将webpack安装到项目依赖中 npm install webpack --sa ...

  9. Webpack学习笔记(一)

    转载http://zhaoda.net/webpack-handbook/module-system.html 转载http://www.cnblogs.com/vajoy/p/4650467.htm ...

随机推荐

  1. pyinstaller 打包selenium脚本 取消cmd

    更改源代码 找到文件(selenium->webdriver->common->service.py) 添加一个参数

  2. 2-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案安全篇(监听Wi-Fi和APP的数据)

    1-STM32物联网开发WIFI(ESP8266)+GPRS(Air202)系统方案安全篇(来看一下怎么样监听网络数据,监听电脑上位机软件的数据) 因为那个软件只能监听咱自己电脑上的数据,所以咱就用电 ...

  3. LOJ2514 CEOI2011 Hotel 贪心

    传送门 考虑一个贪心:对于所有人群按照收益从大到小排序,对于每一个人群找到当前能够选择的代价最小的房间成为一组可行订单(如果没有就不可行),最后将这些订单按照收益排序,选其中正的前\(o\)大即可.找 ...

  4. mysql8 安装笔记

    环境 redhat6.8 ,官网下载 rpm x64 Bund 安装包 安装 rpm -ivh xxx.rpm 安装一系列的rpm. mysql 会创建 mysql 用户及组./etc/my.cnf ...

  5. 分治FFT的三种含义

    分治FFT是几个算法的统称.它们之间并无关联. 分治多项式乘法 问题如求\(\prod_{i=1}^na_ix+b\). 若挨个乘复杂度为\(O(n^2\log n)\),可分治做这件事,复杂度为\( ...

  6. 其它综合-有趣的linux命令行工具-lolcat

    lolcat :一个在 Linux 终端中输出彩虹特效的命令行工具 何为Lolcat Lolcat 是一个针对 Linux,BSD 和 OSX 平台的工具,它类似于 cat,并为 cat 的输出添加彩 ...

  7. 关于mysql主从架构master宕机后,请求转移问题解决办法

    mysql架构:一主一从 问题一:有两台mysql数据库,已做好主从.如果运行某一天master服务器mysql故障导致前端请求无法处理怎么办? 答:将前端需要数据库处理的请求转移到slave机上. ...

  8. [LOJ2310][APIO2017]斑斓之地——可持久化线段树

    题目链接: [APIO2017]斑斓之地 将不是河流的格子染成白色,是河流的格子染成黑色,那么连通块数就是白色格子数$-1*2$的联通白色格子数$-2*1$的联通白色格子数$+2*2$的联通白色格子数 ...

  9. nginx编译安装指定参数

    --prefix=/app/nginx # 安装目录 --conf-path=/app/nginx/conf/nginx.conf # 配置文件 --sbin-path=/app/nginx/sbin ...

  10. OpenLayers学习笔记(九)— 限制地图显示范围

    openlayers 3 地图上限制地图显示及拖动范围,坐标系是4326转3857,中心经纬度精确到小数点后六位,减少误差 GitHub:八至 作者:狐狸家的鱼 本文链接:ol3-限制地图显示及拖动范 ...