humaan / Modaal

An accessible dialog window library for all humans.
http://humaan.com/modaal/
MIT License
2.72k stars 183 forks source link

Modaal with Browserify #86

Open dimitri-rob opened 7 years ago

dimitri-rob commented 7 years ago

Hey,

Thanks for your work, Modaal is very cool 👍 But I got some problems when I try to use it in my workflow.

I use Gulp with Browserify, Babel and Eslint, all in their last versions. When I compile my JS file, Gulp stop running and I got this error :

`events.js:163 throw er; // Unhandled 'error' event ^

Error: Cannot find module 'modaal' from '/home/cua/public_html/lagny/wp-content/themes/bones-cua/library/src/javascripts'`

Any idea ?

danhumaan commented 7 years ago

hey @dimic00 - can't say i've used Modaal in that sort of a setup. Few questions for you:

  1. Just to be certain, you've removed Modaal from your environment to double check it is absolutely the one that triggers the error?
  2. Have you tried any other copies of Modaal js to see if it makes any difference, such as minified vs unminified?
  3. Is there any more info you can provide on your setup? Maybe a copy of your gulp/packages files or something we can take a look at?
  4. Is there any more info on the error message you can supply? Does it tell you anything else such as where exactly in modaal it might be catching the error from?

Lastly, I can't guarantee we will find or provide a solution for you. It's obviously very difficult to test our plugin against every possible environment setup and configuration. That said the more info you can supply the better, will help us narrow down on what the problem might be and offer ideas and solutions.

danb-humaan commented 7 years ago

If you're installing Modaal via npm/yarn I'd recommend doing your require like this: require('modaal/dist/js/modaal') (though recently we did add the aforementioned path to the main field of package.json so it should be done automatically).

Otherwise as @danhumaan said, if you can post the relevant parts of your gulpfile and package.json that'd be super. Been a little while since I last used Browserify but we'll see how we go 🙂

dimitri-rob commented 7 years ago

Thanks a lot Dan and Dan :)

With your require, it's work now, the JS is compiled. But after, I got this error "Uncaught ReferenceError: jQuery is not defined".

In my 'app.js' file, I used jQuery like this : const $ = require('jquery'); const jQuery = $;

To solve the problem, I replace these two lines by : global.jQuery = require("jquery"); const $ = jQuery;

and now it's work perfectly!

lewismcarey commented 7 years ago

@danb-humaan

though recently we did add the aforementioned path to the main field of package.json so it should be done automatically

npm is currently on 0.3.1 without this path update - are you able to distribute a new tag/version please?