smpallen99

smpallen99

Help with brunh-config.js - admin-lte template

And I continue to struggle with brunch…

I’m trying use the npm version of adminlte bootstrap template. I have the css finally working, but now I’m trying to get the JS working. I’m seeing the following JS console error in my browser:

jquery.js:3850 jQuery.Deferred exception: $(...).DataTable is not a function TypeError: $(...).DataTable is not a function
    at HTMLDocument.<anonymous> (http://localhost:4000/admin/countries:3:28)
    at mightThrow (http://localhost:4000/js/app.js:3743:29)
    at process (http://localhost:4000/js/app.js:3811:12) undefined
jQuery.Deferred.exceptionHook @ jquery.js:3850
process @ jquery.js:3646
getDocumentSelection.js:51 Trying to get configured shortcut
getDocumentSelection.js:47 (2) ["Init Response", undefined]
jquery.js:3859 Uncaught TypeError: $(...).DataTable is not a function
    at HTMLDocument.<anonymous> (countries:3)
    at mightThrow (jquery.js:3574)
    at process (jquery.js:3642)
(anonymous) @ countries:3
mightThrow @ jquery.js:3574
process @ jquery.js:3642

Here is my brunch-config.js file:

exports.config = {
  // See http://brunch.io/#documentation for docs.
  files: {
    javascripts: {
      joinTo: {
        "js/app.js": /^(web\/static\/js)|(node_modules)/,
        // "js/vendor.js": /^(web\/static\/vendor\/js)/
      },
      order: {
        before: [
        ]
      }
    },
    stylesheets: {
      joinTo: "css/app.css"
    },
    templates: {
      joinTo: "js/app.js"
    }
  },

  conventions: {
    assets: /^(web\/static\/assets)/
  },

  // Phoenix paths configuration
  paths: {
    // Dependencies and current project directories to watch
    watched: [
      "web/static",
      "test/static"
    ],
    // Where to compile files to
    public: "priv/static"
  },
  // Configure your plugins
  plugins: {
    babel: {
      // Do not use ES6 compiler in vendor code
      ignore: [/web\/static\/vendor/]
    }
  },
  modules: {
    autoRequire: {
      "js/app.js": ["web/static/js/app"]
    }
  },

  npm: {
    styles: { "admin-lte": [
      "bootstrap/bootstrap.css",
      "bootstrap/bootstrap-theme.css",
      "dist/css/AdminLTE.css", 
      "dist/css/skins/_all-skins.css",
      ] },
    enabled: true,
    globals: {
      $: 'jquery',
      JQuery: 'jquery'
    }
  }
};

and here is my web/static/js/app.js file:

import "phoenix_html"

require('jquery')
require('admin-lte')

Questions:

  1. How to I resolve the jQuery error?
  2. How do I include some of the plugins from the admin-lte package?
  3. Any suggestions on how I really learn brunch. I’m tired of the struggle I face everytime I try to do sometihng, especially with npm packages.

Most Liked

peerreynders

peerreynders

Can’t endorse anything but I came across this today: Vue admin - most templates use bootstrap 3 (modern incarnation of jQuery-syndrome?) but this uses Bulma which I haven’t come across before.

Where Next?

Popular in Questions Top

JDanielMartinez
Hi! May someone helps me, please! I have two apps into an umbrella project: the first one is Database, which manages queries, and the se...
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New
dotdotdotPaul
Okay, I'm having a heck of a time trying to figure out how to best handle the validation of belongs_to associations in Ecto. I'm sure I'...
New
Tee
can someone please explain to me how Enum.reduce works with maps
New
Kagamiiiii
Student &amp; New to elixir. Nice language. I want to convert a english character, e.g. “a”, which is stored in a variable, to it’s asci...
New
chewm
Hi guys, nice to meet you to the whole forum, I’m new here, I’m trying to configure visual studio code for elixir, right now the intellis...
New
chrisalley
ExUnit now has describe blocks which is a welcome addition coming from RSpec. In the docs, it states that nested hierarchies of describe ...
New
hpopp
To simplify some tasks at work, I wrote and published this package yesterday. It’s a simple macro that enables Access behaviour on struct...
New
Mooodi
Given a string, how can I get access to its character by index? Enum.at("my_string", 2) doesn't work. Or rather, not char, but a substr...
New
jay1
Why is it that the mnesia database isn’t the most preferred database for use in Elixir/Phoenix?
New

Other popular topics Top

shahryarjb
Hello, I get Persian date from my client and convert it to normal calendar like this: def jalali_string_to_miladi_english_number(persi...
New
dotdotdotPaul
Okay, I'm having a heck of a time trying to figure out how to best handle the validation of belongs_to associations in Ecto. I'm sure I'...
New
pmjoe
I have a relationship of love and hate with Elixir. Lots of things are just absolutely right, but there are some things that are kind of ...
New
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
aalberti333
As the title describes, I’m trying to run Enum.map() over a list of key/value pairs, where the value is a map. My data looks like this: ...
New
fireproofsocks
I’m working on defining a simple Ecto schema for a table (in PostGres), but I don’t see where I can define a column as NOT NULL. Conside...
New
shahryarjb
Hello, I have map which I want to convert it to string like this: the map: %{last_name: "tavakkoli", name: "shahryar"} the string I ne...
New
WestKeys
Currently suffering from paralysis by [HTTP client] analysis. This is rather unusual in Elixirland as there tends to be consensus on the ...
New
jay1
Why is it that the mnesia database isn’t the most preferred database for use in Elixir/Phoenix?
New
joeerl
Hello again - after a longish gap I’ve decided I really must dig into Elixir and see what’s been happening here - so I have a few questio...
New

We're in Beta

About us Mission Statement