Re: Getting Started - Githubissues

terryk01 commented 6 years ago

Hi,

I'm starting to actively look into jhipster - I've alot of experience with spring/spring boot and java. From the jhipster home page I saw your sample app video and I've cloned the repo. But I can't get anything to appear in my development environment. I have created the db locally and the tables are created at start up (with no sample data) but the angular app doesn't load. The api layer starts wit no errors:

./mvn Application 'AssessoriaTorrelles' is running! Access URLs: Local: http://localhost:8080

in another terminal - same directory - run gulp 23:12:53] gulp-inject Nothing to inject into index.html. [Browsersync] Access URLs:

Local: http://localhost:9000

When I go to localhost:9000 - blank page or localhost:8080 - not sure whats going on - any help muh obliged.

Sorry I'm not much of a front-end guy and I suspect the angular app hasn't been loaded into the browser correctly - has anyone else seen this behaviour on master?

Thanks,

Terry.

arnaugarcia commented 6 years ago

Hi, have you run it npm install and bower install ? Everything it's working fine for me. I cloned again the repo from master and I've follow these steps:

npm install
bower install (if you don't have it run npm install -g bower)
create database with the name 'realstatecamp'
./mvnw
Open http://localhost:8080

Arnau Garcia

arnaugarcia commented 6 years ago

I've updated the readme.md and added bower to make these clearer.

Hope it helps.

Arnau Garcia

terryk01 commented 6 years ago

/hipster-sample-apps/realstatecamp(master*) » gulp xxxxxx@XXXXX-MacBook-Pro [20:35:27] Using gulpfile ~/ws/jhipster-sample-apps/realstatecamp/gulpfile.js [20:35:27] Starting 'install'... [20:35:27] Starting 'inject:test'... [20:35:27] Starting 'inject:vendor'... [20:35:27] Starting 'ngconstant:dev'... [20:35:27] Finished 'install' after 64 ms [20:35:27] Starting 'serve'... [20:35:27] Starting 'watch'... [20:35:27] Finished 'watch' after 175 ms [20:35:27] Finished 'serve' after 203 ms [20:35:27] Starting 'default'... [20:35:27] Finished 'default' after 31 μs [20:35:27] Finished 'ngconstant:dev' after 252 ms [20:35:27] gulp-inject 30 files into karma.conf.js. [20:35:27] gulp-inject Nothing to inject into index.html. [20:35:27] Starting 'inject:app'... [Browsersync] Access URLs:

   Local: http://localhost:9000
External: http://192.168.0.24:9000

      UI: http://localhost:3001

UI External: http://192.168.0.24:3001

[Browsersync] Serving files from: src/main/webapp/ [20:35:27] Finished 'inject:test' after 351 ms [20:35:27] Finished 'inject:vendor' after 331 ms [20:35:27] Starting 'inject:dep'... [20:35:27] Finished 'inject:dep' after 5.95 μs [20:35:27] Starting 'copy:languages'... [20:35:27] Finished 'copy:languages' after 49 ms [20:35:27] gulp-inject Nothing to inject into index.html. [20:35:27] Finished 'inject:app' after 287 ms [20:35:27] Starting 'inject:troubleshoot'... [20:35:27] gulp-inject Nothing to inject into index.html. [20:35:27] Finished 'inject:troubleshoot' after 2.35 ms

browser opens on localhost:8080 (chrome) no errors in console or terminal window

API Application 'AssessoriaTorrelles' is running! Access URLs: Local: http://localhost:8080

??

terryk01 commented 6 years ago

sorry after gulp command http://localhost:9000/ is opened in chrome - I've created the db but there is no data in it also ? - is there demo data supplied ?

arnaugarcia commented 6 years ago

Open the console of Chrome and share me the errors pls

terryk01 commented 6 years ago

No errors in console - the response from the server is blank - from gulp tab

[Browsersync] Access URLs:

   Local: http://localhost:9000
External: http://192.168.0.24:9000

      UI: http://localhost:3001

UI External: http://192.168.0.24:3001

[Browsersync] Serving files from: src/main/webapp/ [22:00:07] Finished 'inject:test' after 344 ms [22:00:07] Finished 'inject:vendor' after 322 ms [22:00:07] Starting 'inject:dep'... [22:00:07] Finished 'inject:dep' after 5.95 μs [22:00:07] Starting 'copy:languages'... [22:00:07] Finished 'copy:languages' after 46 ms [22:00:07] gulp-inject Nothing to inject into index.html. [22:00:07] Finished 'inject:app' after 337 ms [22:00:07] Starting 'inject:troubleshoot'... [22:00:07] gulp-inject Nothing to inject into index.html. [22:00:07] Finished 'inject:troubleshoot' after 3.58 ms

Am I running gulp from the right location ?

~/ws/jhipster-sample-apps/realstatecamp(master*) » gulp

arnaugarcia commented 6 years ago

No, there is no data provided.

omc2016 commented 3 years ago

I may be running into the same problem. http://localhost:8080 shows a blank page on Chrome 87.0.4280.88. The same problem is reproducibile on Firefox 91.0.2. These are the steps that I took.

npm install
bower install (had to make a couple changes; see bottom of this message)
create database with the name 'realstatecamp' (switched to H2 database; see bottom of this message) 4 ./mvnw
Open http://localhost:8080

Browser console shows 2 errors.

Error 1

Error 2

This one is probably just a matter of updating API key.

js?libraries=places&key=AIzaSyARkLOBOYtYv3C91iLD3zq8891tduFERiI:81 Google Maps JavaScript API error: InvalidKeyMapError https://developers.google.com/maps/documentation/javascript/error-messages#invalid-key-map-error _.Ee @ js?libraries=places&key=AIzaSyARkLOBOYtYv3C91iLD3zq8891tduFERiI:81 (anonymous) @ common.js:123 (anonymous) @ common.js:179 c @ common.js:107 (anonymous) @ AuthenticationService.Authenticate?1shttp%3A%2F%2F127.0.1.1%3A8080%2F&4sAIzaSyARkLOBOYtYv3C91iLD3zq8891tduFERiI&callback=xdc._1x60eq&key=AIzaSyARkLOBOYtYv3C91iLD3zq8891tduFERiI&token=98422:1

Error on Gulp (fixed)

Separately, aside from the errors showing up on browser console, I am not able to run gulp, as it returns this error.

$ gulp ReferenceError: primordials is not defined at fs.js:45:5 at req_ (/home/oracle/jHipsterProjects/realstatecamp-dependabot-maven-commons-io-commons-io-2.7/node_modules/natives/index.js:143:24) at Object.req [as require] (/home/oracle/jHipsterProjects/realstatecamp-dependabot-maven-commons-io-commons-io-2.7/node_modules/natives/index.js:55:10) at Object. (/home/oracle/jHipsterProjects/realstatecamp-dependabot-maven-commons-io-commons-io-2.7/node_modules/vinyl-fs/node_modules/graceful-fs/fs.js:1:37) at Module._compile (internal/modules/cjs/loader.js:1072:14) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10) at Module.load (internal/modules/cjs/loader.js:937:32) at Function.Module._load (internal/modules/cjs/loader.js:778:12) at Module.require (internal/modules/cjs/loader.js:961:19) at require (internal/modules/cjs/helpers.js:92:18)

Downgrading Node from v14.17.5 to v11.15.0 on my machine as suggested by "https://stackoverflow.com/questions/55921442/how-to-fix-referenceerror-primordials-is-not-defined-in-node-js" solved this problem.

Here is the latest setup log after downgrading Node to v11.15.0. Setup Log.txt

Error 3

With gulp working, I was able to launch http://localhost:3001 and get to the Browsersync page. Clicking http://localhost:9000/ resulted in another browser error. Once again, assessoriaTorrellesApp could not be instantiated, but it failed for another reason. This time it has something to do with ngStorage.

Uncaught Error: [$injector:modulerr] Failed to instantiate module assessoriaTorrellesApp due to: [$injector:modulerr] Failed to instantiate module ngStorage due to: [$injector:nomod] Module 'ngStorage' 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.8/$injector/nomod?p0=ngStorage minErr/<@http://172.16.0.156:9000/bower_components/angular/angular.js:68:12 module/<@http://172.16.0.156:9000/bower_components/angular/angular.js:2082:17 ensure@http://172.16.0.156:9000/bower_components/angular/angular.js:2006:38 module@http://172.16.0.156:9000/bower_components/angular/angular.js:2080:14 loadModules/<@http://172.16.0.156:9000/bower_components/angular/angular.js:4617:22 forEach@http://172.16.0.156:9000/bower_components/angular/angular.js:321:20 loadModules@http://172.16.0.156:9000/bower_components/angular/angular.js:4601:12 loadModules/<@http://172.16.0.156:9000… Angular 9 jQuery 4

Note

I made a couple changes to the downloaded package.

First, I modified bower.json, as it contains an entry that is no longer valid.

There is no longer a copy of ng-map-autocomplete at https://github.com/iazi/ngMapAutocomplete, so I had to clone the ngMapAutocomplete repository and modify bower.json to point to it.

"dependencies": { "ng-map-autocomplete":"omc2016/ngMapAutocomplete" },

Also, bower install did not install ng-flow and ngmap, so I manually installed them.

$ bower install ng-flow#2.7.4 $ bower install ngmap#1.18.4

One other change that I made was to substitute MySQL with H2 for the dev database, as I had trouble getting the MySQL connection to work. In src/main/resources/config/application-dev.yml, datasource url was changed to:

url: jdbc:h2:file:./target/h2db/db/realstatecamp;DB_CLOSE_DELAY=-1

Added H2 dependency to pom.xml

    <dependency>
         <groupId>com.h2database</groupId>
        <artifactId>h2</artifactId>
    </dependency>

omc2016 commented 3 years ago

Screenshot at 2021-09-04 15-37-35

Exception was raised on line 4620 of loadModules angular.js when the module assessoriaTorrellesApp was loaded.

Error: States that specify the 'parent:' property should not have a '.' in their name (property.list)

arnaugarcia commented 3 years ago

Hi I'll take a look at it this week and try to fix it.

omc2016 commented 3 years ago

Thanks. I am debugging through it too and will report further findings. :)

omc2016 commented 3 years ago

I might have found the problem to Error 1 above (Sep 4 message).

These files contain state definitions with '.' in the state names.

app/entities/property/property.state.js app/entities/photo/photo.state.js app/entities/location/location.state.js app/dashboard/entities/request/request.state.js app/dashboard/entities/property/dashboard.property.state.js app/dashboard/entities/notification/notification.state.js app/dashboard/admin/user-management/user-management.state.js

For example, in property.state.js, line 63 "}).state('property.list', {" - There is a '.' in property.list (between property and list), and this caused Error 1. Replacing '.' with '-' (property-list) seemed to solve the problem. https://github.com/arnaugarcia/realstatecamp/blob/master/src/main/webapp/app/entities/property/property.state.js

How did it work before? Maybe we are dealing with different versions of Angular?

omc2016 commented 3 years ago

New problem. Getting HTTP 401 error.

TypeError: Cannot read properties of undefined (reading 'data') at authThen (auth.service.js:60) at processQueue (angular.js:16383) at angular.js:16399 at Scope.$eval (angular.js:17682) at Scope.$digest (angular.js:17495) at Scope.$apply (angular.js:17790) at done (angular.js:11831) at completeRequest (angular.js:12033) at XMLHttpRequest.requestLoaded (angular.js:11966)

Transition Rejection($id: 0 type: 6, message: The transition errored, detail: TypeError: Cannot read properties of undefined (reading 'data')) - stateService.ts:540

TypeError: Cannot read properties of undefined (reading 'data') - stateService.ts:541 at authThen (auth.service.js:60) at processQueue (angular.js:16383) at angular.js:16399 at Scope.$eval (angular.js:17682) at Scope.$digest (angular.js:17495) at Scope.$apply (angular.js:17790) at done (angular.js:11831) at completeRequest (angular.js:12033) at XMLHttpRequest.requestLoaded (angular.js:11966)

Error was raised when auth-expired.interceptor.js was loaded from index.html

The problem came from this block of code in app/services/auth/auth.service.js starting on line 60. $rootScope.toState was undefined. For that matter, $rootScope.fromState was also undefined. Commenting this block of code sidestepped the problem and enabled the website to load on browser, although it still doesn't appear to be working right. At least there is now something to look at. :-)

omc2016 commented 3 years ago

This is how the home page looks in my environment after applying the workarounds that I mentioned in previous messages.

omc2016 commented 3 years ago

Errors on browser console

arnaugarcia / realstatecamp

Re: Getting Started #63

in another terminal - same directory - run gulp 23:12:53] gulp-inject Nothing to inject into index.html. [Browsersync] Access URLs:

UI External: http://192.168.0.24:3001

[Browsersync] Access URLs:

UI External: http://192.168.0.24:3001

Error 1

Error 2

Error on Gulp (fixed)

Error 3

Note