I', using browserify to transform node modules to browser ones for my express app.
This is the command to browserify
browserify -r jquery > ./public/js_app/jquery.js
browserify -r jquery-ui-browserify > ./public/js_app/jquery-ui.js
And this is to require jquery
var jQuery = require('jquery');
this code works fine
jQuery("#info-dialog");
but I don't know how to include jquery-ui-browserify. I have tried this but not works
var jQuery = require('jquery');
require('jquery-ui-browserify');
jQuery("#info-dialog").dialog({
resizable: false,
height: 100,
modal: true
});
Thanks
Here's how i'd set this up
mkdir myProject && cd ./myProject
to create directorynpm init
will interactively create your package.json
sudo npm install jquery jquery-ui-browserify --save
--save
adds them to your package.jsonmkdir app
will create your main foldercd app && touch index.html app.js
app.js
, requiring and using all you wish:
var $ = require('jquery'); require('jquery-ui-browserify');
/myProject/app/
, cd into itbrowserify ./app.js > ./bundle.js
<script src='bundle.js'></script>
just before closing body tag and you're ready to rock.<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<title>My Project</title>
</head>
<body>
<h1>My Project</h1>
<input type="text">
<script src='bundle.js'></script>
</body>
</html>
Here, just marked up a basic html5 page, included the bundle.js
file generated by browserify. Now we can use this bundle.
// app.js
// NOTE: remember, you code this before running `browserify ./app.js > ./bundle.js`
var $ = require("jquery");
require("jquery-ui-browserify");
$(function() {
$('input').autocomplete({ source: ['jquery', 'mootools', 'underscore']} );
});
Hope this helps! It worked perfectly for me.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With