diff --git a/package.json b/package.json index 7bee911c..74d7bb1a 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "laravel-elixir-webpack-official": "^1.0.2" }, "dependencies": { + "jquery": "^2.2.4", "js-cookie": "^2.1.2", "vue": "^1.0.26", "vue-resource": "^0.9.3" diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js index e35f1fd0..06787d9f 100644 --- a/resources/assets/js/app.js +++ b/resources/assets/js/app.js @@ -1,26 +1,22 @@ -window.Cookies = require('js-cookie'); - /** - * Vue.js - * - * Vue is a modern JavaScript for building interactive web interfaces using - * reacting data binding and reusable components. Vue's API is clean and - * simple, leaving you to focus only on building your next great idea. + * First we will load all of this project's JavaScript dependencies which + * include Vue and Vue Resource. This gives a great starting point for + * building robust, powerful web applications using Vue and Laravel. */ -window.Vue = require('vue'); -require('vue-resource'); +require('./bootstrap'); /** - * The XSRF Header - * - * We'll register a HTTP interceptor to attach the "XSRF" header to each of - * the outgoing requests issued by this application. The CSRF middleware - * included with Laravel will automatically verify the header's value. + * Next, we will create a fresh Vue application instance and attach it to + * the body of the page. From here, you may begin adding components to + * the application, or feel free to tweak this setup for your needs. */ -Vue.http.interceptors.push(function (request, next) { - request.headers['X-XSRF-TOKEN'] = Cookies.get('XSRF-TOKEN'); - next(); +var app = new Vue({ + el: 'body', + + ready() { + console.log('Application ready.'); + } }); diff --git a/resources/assets/js/bootstrap.js b/resources/assets/js/bootstrap.js new file mode 100644 index 00000000..98366cba --- /dev/null +++ b/resources/assets/js/bootstrap.js @@ -0,0 +1,34 @@ + +window.Cookies = require('js-cookie'); + +/** + * We'll load jQuery and the Bootstrap jQuery plugin which provides support + * for JavaScript based Bootstrap features such as modals and tabs. This + * code may be modified to fit the specific needs of your application. + */ + +window.$ = window.jQuery = require('jquery'); + +require('bootstrap-sass/assets/javascripts/bootstrap'); + +/** + * Vue is a modern JavaScript for building interactive web interfaces using + * reacting data binding and reusable components. Vue's API is clean and + * simple, leaving you to focus only on building your next great idea. + */ + +window.Vue = require('vue'); + +require('vue-resource'); + +/** + * We'll register a HTTP interceptor to attach the "XSRF" header to each of + * the outgoing requests issued by this application. The CSRF middleware + * included with Laravel will automatically verify the header's value. + */ + +Vue.http.interceptors.push(function (request, next) { + request.headers['X-XSRF-TOKEN'] = Cookies.get('XSRF-TOKEN'); + + next(); +});