JavaScript

JavaScript assets are kept in the resources/assets/js folder. There are several .js files in this directory, as well as a sub-directory component, with a .vue file. This latter file will be explained in another chapter so we'll ignore it for now.

The main JavaScript file is app.js. You'll see the familiar Vue constructor in this file, but also some syntax that may not be as familiar. On the first line is a require function that is intended to import an adjacent file, bootstrap.js, which in turn loads other libraries including jQuery and Lodash.

require is not a standard JavaScript function and must be resolved somehow before this code can be used in a browser.

resources/assets/js/app.js:

require('./bootstrap');

window.Vue = require('vue');

Vue.component('example', require('./components/Example.vue'));

const app = new Vue({
  el: '#app'
});

CSS

If you haven't heard of Sass before, it's a CSS extension that makes it easier to develop CSS. A default Laravel installation includes the...