pc035860 / angular-highlightjs

AngularJS directive for syntax highlighting with highlight.js
http://pc035860.github.io/angular-highlightjs/example/
MIT License
294 stars 53 forks source link

Electron App: Uncaught Error: Cannot find module 'angular' #70

Open nine-2-five opened 8 years ago

nine-2-five commented 8 years ago

I'm having trouble loading this script in an Electron app. Angular app is working fine with the basic highlight.min.js script, but when I add your script after the angular.js script I get this:

module.js:438 Uncaught Error: Cannot find module 'angular'Module._resolveFilename @ module.js:438Module._load @ module.js:386Module.require @ module.js:466require @ internal/module.js:20(anonymous function) @ angular-highlightjs.js:9(anonymous function) @ angular-highlightjs.js:15
angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module hljs due to:
Error: [$injector:nomod] Module 'hljs' 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.
http://errors.angularjs.org/1.5.5/$injector/nomod?p0=hljs
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:68:12
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:2070:17
    at ensure (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:1994:38)
    at module (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:2068:14)
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4564:22
    at forEach (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:322:20)
    at loadModules (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4548:5)
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4565:40
    at forEach (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:322:20)
    at loadModules (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4548:5)
http://errors.angularjs.org/1.5.5/$injector/modulerr?p0=hljs&p1=Error%3A%20…am-ftp-launcher%2Fapp%2Fbower_components%2Fangular%2Fangular.js%3A4548%3A5)
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:68:12
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4587:15
    at forEach (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:322:20)
    at loadModules (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4548:5)
    at file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4565:40
    at forEach (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:322:20)
    at loadModules (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4548:5)
    at createInjector (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:4470:19)
    at doBootstrap (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:1746:20)
    at bootstrap (file:///C:/dev/moje/team-ftp-launcher/app/bower_components/angular/angular.js:1767:12)
http://errors.angularjs.org/1.5.5/$injector/modulerr?p0=app&p1=Error%3A%20%…m-ftp-launcher%2Fapp%2Fbower_components%2Fangular%2Fangular.js%3A1767%3A12)(anonymous function) @ angular.js:68(anonymous function) @ angular.js:4587forEach @ angular.js:322loadModules @ angular.js:4548createInjector @ angular.js:4470doBootstrap @ angular.js:1746bootstrap @ angular.js:1767angularInit @ angular.js:1652(anonymous function) @ angular.js:30863trigger @ angular.js:3166defaultHandlerWrapper @ angular.js:3456eventHandler @ angular.js:3444
pc035860 commented 8 years ago

Hi @isvaljek ,

I'm not familiar with Electron. The error seems related to angular module can not be found. angular is a required dependency in the case that your module loader/bundler treats angular-highlightjs as an AMD/CommonJS module.

You'll have to somehow tell the bundler that your angular is in the global.

e.g. browserify-shim for browserify

nine-2-five commented 8 years ago

Thanks Chih-Hsuan, but I don't know that if Electron even has a module loader. All the other angular scripts like material and ui-router are loaded by script tag in the main index.html.

2016-07-05 16:17 GMT+02:00 Chih-Hsuan Fan notifications@github.com:

Hi @isvaljek https://github.com/isvaljek ,

I'm not familiar with Electron. The error seems related to angular module can not be found. angular is a required dependency in the case that your module loader/bundler treats angular-highlightjs as an AMD/CommonJS module.

You'll have to somehow tell the bundler that your angular is in the global.

e.g. browserify-shim https://github.com/thlorenz/browserify-shim for browserify

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/pc035860/angular-highlightjs/issues/70#issuecomment-230490976, or mute the thread https://github.com/notifications/unsubscribe/ACYmq3JWh9DBfLDGMxYAEHnvbat8jvOEks5qSmdlgaJpZM4JFBjw .

pc035860 commented 8 years ago

It seems that the <script></script> environment provided in Electron app's index.html actually uses node-like module system (CommonJS).

I guess if you simply install angular with npm rather than bower will solve the issue.

After install angular via npm, change the angular script tag to something like:

<script src="path_to_node_module/angular/angular.min.js"></script>
<script src="other angular modules"></script>

or

<script>
window.angular = require('angular');
</script>
<script src="other angular modules"></script>