sample js component

taylorotwell · taylorotwell · commit e9fe020c0c39 · 2016-07-23T13:40:49.000-05:00
diff --git a/gulpfile.js b/gulpfile.js
@@ -1,5 +1,7 @@
 var elixir = require('laravel-elixir');
 
+require('laravel-elixir-vue');
+
 /*
  |--------------------------------------------------------------------------
  | Elixir Asset Management
diff --git a/package.json b/package.json
@@ -13,6 +13,7 @@
   "dependencies": {
     "jquery": "^2.2.4",
     "js-cookie": "^2.1.2",
+    "laravel-elixir-vue": "^0.1.4",
     "vue": "^1.0.26",
     "vue-resource": "^0.9.3"
   }
diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js
@@ -13,6 +13,8 @@ require('./bootstrap');
  * the application, or feel free to tweak this setup for your needs.
  */
 
+Vue.component('example', require('./components/Example.vue'));
+
 var app = new Vue({
     el: 'body',
 
diff --git a/resources/assets/js/bootstrap.js b/resources/assets/js/bootstrap.js
@@ -8,7 +8,6 @@ window.Cookies = require('js-cookie');
  */
 
 window.$ = window.jQuery = require('jquery');
-
 require('bootstrap-sass/assets/javascripts/bootstrap');
 
 /**
@@ -18,7 +17,6 @@ require('bootstrap-sass/assets/javascripts/bootstrap');
  */
 
 window.Vue = require('vue');
-
 require('vue-resource');
 
 /**
diff --git a/resources/assets/js/components/Example.vue b/resources/assets/js/components/Example.vue
@@ -0,0 +1,13 @@
+<template>
+    <div>
+        <h1>Example Component</h1>
+    </div>
+</template>
+
+<script>
+    export default {
+        ready() {
+            console.log('Component ready.')
+        }
+    }
+</script>
