Create an array from for loop using MySQL database data

Question

I am trying to create a script using Javascript that fetches data from a MySQL database in order to create an array with that data, but I am stuck while trying to make Javascript connect to the DB.

Here is my JS code:

var mysql = require('mysql');

var con = mysql.createConnection({
    host: "*DELETED*",
    user: "*DELETED*",
    password: "*DELETED*",
    database: "*DELETED*"
});

// Array approach
var config = {
        container: "#collapsable-example",

        animateOnInit: true,

        node: {
            collapsable: true
        },
        animation: {
            nodeAnimation: "easeOutBounce",
            nodeSpeed: 700,
            connectorsAnimation: "bounce",
            connectorsSpeed: 700
        }
    };


    var array = [];

for (var i = 0; i <= con.query("SELECT MAX (id_dim) FROM dim"); i++) {

    var nome = con.query("SELECT itempt_dim FROM dim WHERE id_dim = " + i);
    var parente = "parent: " + con.query("Select itempt_dim from dim, rdim Where iddim_rdim = " + i);
    var nomeEscrito = "text: " + con.query("SELECT itempt_dim FROM dim WHERE id_dim = " + i);
    //var droplevel = "childrenDropLevel: " +
    //var pseudo = "pseudo: " +
    //var imagem = "image: " +
    array.push(nome = {
        parente,
        nomeEscrito
    });

}

console.log(array);

chart_config = [config, Sharan, Sharan2];

and I get the following error:

ReferenceError: require is not defined

EDIT1: so i used the JS inside of the PHP file and tried the following:

<?php
      require('common/db.php');
    ?>

    <script type="text/javascript">

      // Array approach
      var config = {
              container: "#collapsable-example",

              animateOnInit: true,

              node: {
                  collapsable: true
              },
              animation: {
                  nodeAnimation: "easeOutBounce",
                  nodeSpeed: 700,
                  connectorsAnimation: "bounce",
                  connectorsSpeed: 700
              }
          };


          var array = [];
          var maxID = "<?php $con->query('SELECT MAX(id_dim) FROM dim'); ?>"

          for (var i = 1; i <= maxID ; i++) {

            var nome = "<?php $con->query('SELECT itempt_dim FROM dim WHERE id_dim = " + i + "'); ?>";
            var parente = "parent: " + " <?php $con->query('SELECT itempt_dim FROM dim, rdim WHERE iddim_rdim = " + i + "'); ?>";
            var nomeEscrito = "text: " + "<?php $con->query('SELECT itempt_dim FROM dim WHERE id_dim = " + i + "'); ?>";
            //var droplevel = "childrenDropLevel: " +
            //var pseudo = "pseudo: " +
            //var imagem = "image: " +
            array.push(nome = {
              parente,
              nomeEscrito
            });

          }

          console.log(document.write(array));

          chart_config = [config, Sharan, Sharan2];


    </script>

    <script>
        tree = new Treant( chart_config );
    </script>