I have require is not defined error

Question

Trying to implement datatables row-details functionality(https://datatables.yajrabox.com/eloquent/row-details) in my laravel 5.5.40/ Voyager template( "tcg/voyager": "^1.0" )/ Bootstrap 3.3.7 application I encountered an error:

app.js:24 Uncaught ReferenceError: Handlebars is not defined

Googling, I found a decision :

var Handlebars = require('handlebars');

But I got an error:

articles:915 Uncaught ReferenceError: require is not defined

I found which files are attached in the file config/voyager.php:

   ...
    // Here you can specify additional assets you would like to be included in the master.blade
    'additional_css' => [
        'css/bootstrap-tagsinput-typeahead.css',
        'css/bootstrap-tagsinput.css',
        'css/bootstrap-treeview.css',
        'css/customisation.css',
        'css/spectrum.css',
    ],

    'additional_js' => [
        'js/bootstrap-tagsinput.js',
        'js/spectrum.js',
    ],
   ...

Can you give a hint, which file/plugin have I to attach to the list above? In the project I found a file /node_modules/webpack/lib/RequireJsStuffPlugin.js Is it what I need and how to attach it and how?

Thanks!

MODIFIED : after googlingI I installed

npm install requirejs 

with output

+ requirejs@2.3.5
added 1 package from 1 contributor in 26.245s

But it did not help, I still get error :

ReferenceError: require is not

Have to include requirejs in some config files or in my script and how if yes?

MODIFIED 2:

With resource How do I include a JavaScript file in another JavaScript file? I try to fix the error by example :

I just wrote this JavaScript code (using Prototype for DOM manipulation):

For tis I copied file /public/js/require.js ( Prototype JavaScript framework, version 1.7.2 ) and file public/js/require.js by url https://gist.github.com/nornagon/284442

and in my blade template :

<script src="/js/prototype.js"></script>
<script src="/js/require.js"></script>
@section('javascript')

and got error :

Uncaught TypeError: element.attachEvent is not a function
    at observeStandardEvent (prototype.js:6950)
    at observe (prototype.js:6940)
    at HTMLScriptElement._methodized [as observe] (prototype.js:456)
    at require.js:21
    at showArticleListing (articles:1021)
    at HTMLDocument.<anonymous> (articles:896)
    at c (app.js:24)
    at u (app.js:24)

on a line :

    var Handlebars = require('handlebars');

On the link above there were several example of attaching js files. But my case is different , as having error :

Uncaught ReferenceError: Handlebars is not defined

I tried to include Handlebars, but in my project there is no any file like Handlebars.js... ?

MODIFIED 3:

In the comments of the example there was fixing issue using Mustache.js: https://github.com/yajra/laravel-datatables/issues/1511 I follow it, as :

@extends('layouts.master')

@section('content')


    <table class="table table-bordered" id="users-table">
        <thead>
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Email</th>
            <th>Created At</th>
            <th>Updated At</th>
        </tr>
        </thead>
    </table>

@stop

@push('scripts')

    <script src="//cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.0/mustache.min.js"></script>

    <script id="details-template" type="mustache/x-tmpl">
    <table class="table">
        <tr>
            <td>Full name:</td>
            <td><%name%></td>
        </tr>
        <tr>
            <td>Email:</td>
            <td><%email%></td>
        </tr>
        <tr>
            <td>Extra info:</td>
            <td>And any further details here (images etc)...</td>
        </tr>
    </table>
    </script>

    <script  >

        $(function() {

            Mustache.tags = ["<%", "%>"];
            var template = $('#details-template').html();

            console.log("template::")
            console.log( template )

            var table= $('#users-table').DataTable({
                processing: true,
                serverSide: true,
                ajax: '{!! route('get_users') !!}',
                columns: [
                    {
                        "className":      'details-control',
                        "orderable":      false,
                        "searchable":     false,
                        "data":           null,
                        "defaultContent": ''
                    },

                    { data: 'id', name: 'id' },
                    { data: 'name', name: 'name' },
                    { data: 'email', name: 'email' },
                    { data: 'created_at', name: 'created_at' },
                    { data: 'updated_at', name: 'updated_at' }
                ]
            });


            // Add event listener for opening and closing details
            $('#users-table tbody').on('click', 'td.details-control', function () {
                console.log( '-1' )
                var tr = $(this).closest('tr');
                console.log("-2 tr::")
                console.log( tr )

                var row = table.row( tr );
                console.log("-3 row::")
                console.log( row )


                if ( row.child.isShown() ) {
                    // This row is already open - close it
                    row.child.hide();
                    tr.removeClass('shown');
                }
                else {
                    // Open this row
//                    row.child( template(row.data()) ).show();
                    row.child( Mustache.render(template, row.data()) ).show();
                    console.log("row::")
                    console.log( row )


                    tr.addClass('shown');
                }
            });
        });
    </script>

@endpush

And I got error :

jquery.dataTables.min.js:59 Uncaught TypeError: Cannot read property 'style' of undefined
    at Ga (jquery.dataTables.min.js:59)
    at ga (jquery.dataTables.min.js:45)
    at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:93)
    at Function.each (jquery.js:383)
    at jQuery.fn.init.each (jquery.js:136)
    at jQuery.fn.init.m [as dataTable] (jquery.dataTables.min.js:83)
    at jQuery.fn.init.P.h.fn.DataTable (jquery.dataTables.min.js:159)
    at HTMLDocument.<anonymous> (index:89)
    at fire (jquery.js:3119)
    at Object.fireWith [as resolveWith] (jquery.js:3231)

Looking at the console the template code was found: https://i.stack.imgur.com/2K01I.jpg
as there were misunderstanding of where to put the template

I have no error if to remove the definition of the first column:
                    {
                        "className":      'details-control',
                    ...

Is there a way to fix it ?