diff --git a/README.md b/README.md
index a23b18f..58729f1 100644
--- a/README.md
+++ b/README.md
@@ -40,7 +40,8 @@ Otherwise, the `mixins` way also works.
 
     <!-- the list -->
     <ul v-show="hasItems">
-      <li v-for="item in items" :class="activeClass($index)" @mousedown="hit" @mousemove="setActive($index)">
+      <!-- for vue@1.0 use: ($item, item) -->
+      <li v-for="(item, $item) in items" :class="activeClass($item)" @mousedown="hit" @mousemove="setActive($item)">
         <span v-text="item.name"></span>
       </li>
     </ul>
diff --git a/demo/Typeahead.vue b/demo/Typeahead.vue
index 6ded9b3..7ebb436 100644
--- a/demo/Typeahead.vue
+++ b/demo/Typeahead.vue
@@ -19,7 +19,7 @@
            @input="update"/>
 
     <ul v-show="hasItems">
-      <li v-for="item in items" :class="activeClass($index)" @mousedown="hit" @mousemove="setActive($index)">
+      <li v-for="(item, $item) in items" :class="activeClass($item)" @mousedown="hit" @mousemove="setActive($item)">
         <span class="name" v-text="item.name"></span>
         <span class="screen-name" v-text="item.screen_name"></span>
       </li>
diff --git a/demo/index.html b/demo/index.html
index 43461c3..ee5e803 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -10,7 +10,7 @@
     <link rel="stylesheet" href="assets/style.css">
   </head>
   <body>
-    <div class="container">
+    <div id="demo" class="container">
       <h1>Typeahead</h1>
       <h4>Vue.js component</h4>
       <a href="https://github.com/pespantelis/vue-typeahead" class="button">Source on GitHub</a>
diff --git a/demo/main.js b/demo/main.js
index 537df96..3935463 100644
--- a/demo/main.js
+++ b/demo/main.js
@@ -5,7 +5,7 @@ import Typeahead from './Typeahead.vue'
 Vue.prototype.$http = Axios
 
 new Vue({
-  el: 'body',
+  el: '#demo',
   components: {
     Typeahead
   }
diff --git a/package.json b/package.json
index bf55f51..b21a4b4 100644
--- a/package.json
+++ b/package.json
@@ -21,9 +21,11 @@
     "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
     "dist": "babel src/main.js --out-file dist/vue-typeahead.common.js"
   },
+  "peerDependencies": {
+    "vue": "^1.0.21 || ^2.x.x"
+  },
   "dependencies": {
-    "babel-runtime": "^6.0.0",
-    "vue": "^1.0.21"
+    "babel-runtime": "^6.0.0"
   },
   "devDependencies": {
     "axios": "^0.15.3",
@@ -36,10 +38,12 @@
     "css-loader": "^0.23.0",
     "eslint": "^2.13.1",
     "eslint-config-vue": "^1.0.3",
+    "eslint-plugin-html": "^1.5.5",
     "vue-hot-reload-api": "^1.2.0",
     "vue-html-loader": "^1.0.0",
-    "vue-loader": "^8.3.0",
+    "vue-loader": "^11.1.4",
     "vue-style-loader": "^1.0.0",
+    "vue-template-compiler": "^2.2.1",
     "webpack": "^1.12.2",
     "webpack-dev-server": "^1.12.0"
   }
diff --git a/webpack.config.js b/webpack.config.js
index 8aa591a..d79bc7e 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -7,6 +7,11 @@ module.exports = {
     publicPath: '/build/',
     filename: 'build.js'
   },
+  resolve: {
+    alias: {
+      'vue': 'vue/dist/vue.common'
+    }
+  },
   module: {
     loaders: [
       {
