Browserify error "require is not defined"

My index.html file:

<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">

<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->

<!-- ionic/angularjs js -->

<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="js/bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>

<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
Then I add this line to my app.js file > .constant('Crypto',require('crypto'))

I ran cmd command “browserify app.js -o bundle.js”, it generate this file perfectly, with code for Crypto module. But when I run command “ionic serve”, it still got error “require is not defined”.
How can I fix it? Thanks!

you need to include the bundle.js in your index.html instead of the app.js.

now you are creating a bundle with the solved require-statement, but never using it.

1 Like

Ok I removed and it work :smiley:.
Thanks!
But I have another question.
Here my service file:

angular.module(‘loyaltyportalapp.services’,).factory(‘Json’,[‘$http’,‘Crypto’,function($http,Crypto){
return {
getAllProduct:function(){
console.log(Crypto.SHA256(“Message”));
return $http.get(‘myserver.com’,{
});
}
}
}]);

I tried to test the Crypto constant which I defined in app.js file. But I cannot call it. I got message Crypto.SHA256 is not a function. So how can I use this constant?
Thanks!

i do not know many things about crypto, but this is not an angularjs modules?

So you can not load it via dependency injection.

Hi chuotcong! I’m having the same trouble you have got. Could yuo please clarify better what do you remove ?

I follow the steps in browserify doc that are the same you did :

  1. .constant(‘Crypto’,require(‘crypto’))
  2. bundle.js creation with browserify main.js -o bundle.js
  3. bundle js import in index.html

but still require is not defined.

Please help!.

Thanks very much in advance

Hi!
Have you fixed?
I think better you give me your email. Then I will send you my project, so that you can follow. I finished it for a long time, and don’t remember how to fix :D.

Hi Chuotcong it’s me again sorry. No idea if my reply is arrived (with email address). Anyway, any hints/suggestions should be really appreciated to resolve the unresolved issue. Thanks again.

Finally worked! :sunny:

I try to detail more chuotcong answer :slight_smile:

  1. browserify app.js -o bundle_app.js generate the bundle_app.js file that wrap all the app.js content

  2. remove the old app.js inclusion in index.html file

  3. add the bundle_app.js inclusion in index.html file

Now require command should work properly .

i dont have a controller.js or service.js and when I remove the app.js from the index my whole app stops working. I get this:

Uncaught Error: [$injector:modulerr] Failed to instantiate module ionicApp due to: Error: [$injector:nomod] Module 'ionicApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.