Sample project using Vuetable-2 in Laravel 5.4 and Laravel-Mix
Switch branches/tags
Nothing to show
Clone or download
Latest commit 42af770 Oct 7, 2017
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
app Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
bootstrap Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
config Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
database Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
public recompile Aug 27, 2017
resources Update app.js as MyVuetable.vue was updated. Aug 24, 2017
routes Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
storage Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
tests initial commit Feb 13, 2017
.env.example Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
.gitattributes Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
.gitignore Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
artisan Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
composer.json Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
composer.lock recompile Aug 27, 2017
package-lock.json Add babel-preset-es2015 to dependencies. Aug 24, 2017
package.json Add babel-preset-es2015 to dependencies. Aug 24, 2017
phpunit.xml Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
readme.md Fix typo for Bable to Babel. Oct 4, 2017
server.php initial commit Feb 13, 2017
webpack.mix.js Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017
yarn.lock Use Beyond Compare to see differences from Laravel 5.4.35 scaffold. U… Aug 24, 2017

readme.md

Sample project using Vuetable-2 with Laravel 5.4 and Laravel Mix

Trying this sample project

  • clone the repo to your local machine
  • cd into the directory
  • install laravel dependency packages using composer install
  • create .env file and generate APP_KEY using cp .env.example .env && php artisan key:generate
  • install client-side javascript packages dependency by npm install
  • run the project using php artisan serve or whatever appropriate in your machine setup.

You should see something like this.

image

Steps to use Vuetable-2 in your Laravel 5.4 project

  • create laravel 5.4 project

      laravel new vuetable-l54
    
  • go into the project directory and install node packages

      npm install
    
  • create .env file by copying from .env.example

      cp .env.example .env
    
  • generate APP_KEY

      php artisan key:generate
    
  • replace welcome.blade.php with the version in the repo or just add component

  • install additional babel plugins

      npm install babel-plugin-transform-runtime babel-preset-stage-2 babel-preset-es2015 --save-dev
    
  • install vuetable-2

      npm install vuetable-2 --save-dev
    
  • install vuetable-2 dependencies

      npm install accounting lodash moment vue-events --save-dev
    
  • create your Vue component in resources\assets\js\components

  • register the component in resources\assets\js\app.js

      Vue.component('my-vuetable', require('./components/MyVuetable.vue'));
  • compile using Laravel-Mix by running

      npm run dev