Uncaught ReferenceError: require is not defined on demand ('./bootstrap') Laravel Mix

Question

I compiled my stylesheets and javascript using Laravel Mix, the code is below:

const { mix } = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

// mix.js('resources/assets/js/app.js', 'public/js')
//    .sass('resources/assets/sass/app.scss', 'public/css');

mix.babel([
    'public/js/plugins/loaders/pace.min.js',
    'resources/assets/js/app.js',
    'public/js/plugins/loaders/blockui.min.js',
    'public/js/plugins/ui/nicescroll.min.js',
    'public/js/plugins/ui/drilldown.js',
    'public/js/plugins/ui/fab.min.js',
    'public/js/plugins/forms/selects/select2.min.js',
    'public/js/plugins/forms/styling/uniform.min.js',
    'public/js/plugins/ui/moment/moment.min.js',
    'public/js/plugins/ui/fullcalendar/fullcalendar.min.js',
    'public/js/core/app.js',
    'public/js/pages/user_pages_profile.js',
] , 'public/js/app.js');

mix.styles([
    'public/css/icons/icomoon/styles.css',
    'resources/assets/sass/app.scss',
    'public/css/core.css',
    'public/css/components.css',
    'public/css/colors.css',
],'public/css/app.css');

Below is my app.js

/**
 * First we will load all of this project JavaScript dependencies which
 * includes Vue and other libraries. It is a great starting point when
 * building robust, powerful web applications using Vue and Laravel.
 */

require('./bootstrap'); //complains on this line after compilation

/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */

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

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

He complains about the necessary ,
Uncaught ReferenceError: require is not specified in app.js: 354 , this is a compiled app.js
I tried:
1- mix.scripts
2- mix.babel (according to the docs this will translate any ES2015 code to vanilla JavaScript, which is all browsers will understand.)
What am I missing here?

Answer 1

node, , . node JS 6 ES2015. node,

node -v

Ubuntu 16, , node.

cd ~
curl -sL https://deb.nodesource.com/setup_6.x -o nodesource_setup.sh
sudo bash nodesource_setup.sh
sudo apt-get install nodejs
sudo npm update -g npm 
sudo ln -s /usr/bin/nodejs /usr/bin/node

npm run dev, Laravel.