vuejs · znck · May 13, 2017 · Jan 16, 2017 · Jan 16, 2017 · Jan 18, 2017
diff --git a/README.md b/README.md
@@ -47,7 +47,7 @@ Using the `<v-touch>` component
 vue-touch supports all Hammer Events ot of the box, just bind a listener to the component with `v-on` and vue-touch will setup the Hammer Manager & Recognizer for you.
 
 |Recognizer|Events|Example|
-|---|----|----|
+|---|----|----|----|
 |**Pan**|`pan`, `panstart`, `panmove`, `panend`, `pancancel`, <br>`panleft`, `panright`, `panup`, `pandown` |`v-on:panstart="callback"`|
 |**Pinch**|`pinch`, `pinchstart`, `pinchmove`,`pinchend`, <br>`pinchcancel`, `pinchin`, `pinchout`| `v-on:pinchout="callback"`|
 |**Press**|`press`, `pressup`|`v-on:pressup="callback"`|
@@ -92,6 +92,31 @@ VueTouch keeps that from you and accepts simple strings as directions:
 const directions = ['up', 'down', 'left', 'right', 'horizontal', 'vertical', 'all']
 ```
 
+#### `recognize-with` & `require-failure` Props
+
+To define which gestures should be recognized together, use `recognize-with`:
+
+```html
+<v-touch
+  v-on:pan="handler"
+  v-on:swipe="otherHandler"
+  recognize-with="{pan: ['swipe' /*, other recognizers*/]}"
+/>
+```
+
+If you a recognizer to trigger only if another one failes, use `require-failure`:
+```html
+<!--
+  the tap handler will only be called if the doubletp recognizer doesn't trigger.
+-->
+<v-touch
+  v-on:tap="handleSingleTap"
+  v-on:doubletap="handleDoubleTap"
+  require-failure="{tap: ['doubletap']}"
+/>
+
+```
+
 #### The 'enabled' Prop
 
 |Prop|allowed Values|

diff --git a/build/rollup.config.prod.js b/build/rollup.config.prod.js
diff --git a/build/rollup.js b/build/rollup.js
@@ -0,0 +1,45 @@
+const buble = require('rollup-plugin-buble');
+const commonjs = require('rollup-plugin-commonjs');
+const nodeResolve = require('rollup-plugin-node-resolve');
+const cleanup = require('rollup-plugin-cleanup');
+const { rollup } = require('rollup');
+const path = require('path');
+
+const bubbleConfig = {
+  transforms: { dangerousForOf: true },
+};
+
+// UMD
+rollup({
+  entry: path.resolve(__dirname, '../src/index.js'),
+  sourceMap: true,
+  external: ['hammerjs'],
+
+  plugins: [
+    buble(bubbleConfig),
+    nodeResolve({ jsnext: true, main: true }),
+    commonjs(),
+    cleanup()
+  ]
+}).then(bundle => bundle.write({
+  format: 'umd',
+  exports: 'named',
+  moduleName: 'VueTouch',
+  globals: {
+    hammerjs: 'Hammer'
+  },
+  dest: path.join(path.resolve(__dirname, '../dist'), 'vue-touch.js')
+}))
+
+// ESM
+rollup({
+  entry: path.resolve(__dirname, '../src/index.js'),
+  external: ['hammerjs'],
+  plugins: [
+    buble(bubbleConfig),
+    cleanup()
+  ]
+}).then(bundle => bundle.write({
+  format: 'es',
+  dest: path.join(path.resolve(__dirname, '../dist'), 'vue-touch.esm.js'),
+}));
diff --git a/example/example.js b/example/example.js
@@ -3,7 +3,7 @@ var Vue = require('vue')
 var VueTouch
 
 if (process.env.NODE_ENV === 'development') {
-  VueTouch = require('../src')
+  VueTouch = require('../src').default
 }
 else {
   VueTouch = require('../dist/vue-touch.js')
@@ -29,10 +29,14 @@ new Vue({
     state: {rotate: true, doubletap: true}
   },
   methods: {
-    test: function (e) {
+    test: function (e, name = '') {
       delete e.target
       this.event = e
-      console.log(e)
+      console.log(e, name)
+    },
+    testdouble: function (e) {
+      console.log('doubletap')
+      this.test(e)
     }
   }
 })
diff --git a/example/index.html b/example/index.html
@@ -14,13 +14,19 @@
   </head>
   <body>
     <div id="app">
-      <!-- <v-touch tag="div" id="test-div"
-        @swipe="test"
-        @doubletap="test"
-        :doubletap-options="{taps: 3}"
+      <v-touch tag="div" id="test-div"
+        @tap="test($event, 'single')"
+        @doubletap="test($event, 'double')"
+        :doubletap-options="{ intervall: 400 }"
+        :recognize-with="{ doubletap: ['tap'] }"
+        :require-failure="{ tap: ['doubletap'] }"
       >
+      <!--
+
+      :require-failure="{ tap: ['doubletap'] }"
+      -->
         <p>{{event.type}}</p>
-      </v-touch> -->
+      </v-touch>
       <pre>{{event}}</pre>
 
       <rotator :state="state">

diff --git a/package.json b/package.json
@@ -2,8 +2,11 @@
   "name": "vue-touch",
   "version": "2.0.0-beta.4",
   "main": "dist/vue-touch.js",
+  "jsnext:main": "dist/vue-touch.esm.js",
+  "module": "dist/vue-touch.esm.js",
   "files": [
     "dist/vue-touch.js",
+    "dist/vue-touch.esm.js",
     "dist/vue-touch.js.map",
     "dist/vue-touch.min.js",
     "dist/hammer-ssr.js"
@@ -39,7 +42,7 @@
     "vue": "^2.0.0"
   },
   "scripts": {
-    "build": "node_modules/.bin/rollup -m -c build/rollup.config.prod.js && uglifyjs dist/vue-touch.js -c -m > dist/vue-touch.min.js && cp src/hammer-ssr.js dist/",
+    "build": "node build/rollup.js && uglifyjs dist/vue-touch.js -c -m > dist/vue-touch.min.js && cp src/hammer-ssr.js dist/",
     "dev": "node build/devserver.js",
     "test:watch": "NODE_ENV=development node_modules/.bin/ava --watch --verbose",
     "test:unit:dev": "NODE_ENV=development node_modules/.bin/ava --verbose",