angular-fullstack / generator-angular-fullstack

Yeoman generator for an Angular app with an Express server
https://awk34.gitbook.io/generator-angular-fullstack
6.12k stars 1.24k forks source link

angular-fullstack generator failed to load template while running dist folder #1936

Closed biks152207 closed 8 years ago

biks152207 commented 8 years ago

i am having issue regarding the template load while running dist folder with the command gulp serve:dist The issue is random in every build.sometime it wont load the template inside components folder(directives) and sometime it won't load the template assigned to ui router states.for more detail you can see the stackoverflow issue here. http://stackoverflow.com/questions/37498159/angular-fullstack-generator-failed-to-load-template-while-running-dist-folder

Koslun commented 8 years ago

Could you update with the options you chose in the generator, what version of the generator you're using and what OS and MongoDB version you're using? Also, what changes did you make to the project post generation? Might be good to also include a list of your global npm packages from running npm list -g --depth=0 (don't really care what dependencies they have).

I would also recommend trying to simply run the built project with node directly. I.e.

  1. build the project with gulp build
  2. Set the node environment to production with export NODE_ENV=production
  3. Go to the dist/server folder (in the same console as step 2)
  4. Run the app.js file with node app.js (in the same console as step 2)

This way we can more easily see where the error is.

biks152207 commented 8 years ago

my generator version is 1.7.0,OS is el capitan 10.11.5,mongodb version 3.0.3.npm list -g --depth=0 /Users/bikram/.nvm/versions/node/v5.0.0/lib └── npm@3.5.1 i did same step.still same error.http://localhost:8080/components/navbar/navbar.html Failed to load resource: the server responded with a status of 404 (Not Found)

Koslun commented 8 years ago

Sure that it's 1.7.0? Cause that's quite old, latest is 3.7.x. Gulp support in that version is pretty unstable at best as far as I remember it. Any bug in that version has likely been fixed by now. Might be a better option to generate a new version of the project if you haven't done much to change it.

Should find the generator version at the top of the gulp file and/or in the .yo-rc.json file. You can copy .yo-rc.json file here and we'll know what options you chose too.

biks152207 commented 8 years ago

i have already done many things.i am middle of the project.so what will be the fixes?please help

Koslun commented 8 years ago

Still need more details. Looking at the stackoverflow link you mention both grunt and gulp too. So as stated it would be very useful to know what options you chose, only really need to copy the .yo-rc.json file for that. And can definitely see what version of the generator you used by either looking there or/and at the top of your grunt or gulp file.

I especially think you're mistaken about either the version number or what generator you used. If you take a look at the changelog there is actually no entry for a 1.7 release. It was 1.4 and then straight to 2.0. Where the 1.x release line further did not have the structure you seem to be using, with navbar.html in components, that came in 2.0.

So again, you need to check your generator and version number.

biks152207 commented 8 years ago

Hi thanks for you reply here is my generator version

{
  "generator-angular-fullstack": {
    "generatorVersion": "3.5.0",
    "endpointDirectory": "server/api/",
    "insertRoutes": true,
    "registerRoutesFile": "server/routes.js",
    "routesNeedle": "// Insert routes below",
    "routesBase": "/api/",
    "pluralizeRoutes": true,
    "insertSockets": true,
    "registerSocketsFile": "server/config/socketio.js",
    "socketsNeedle": "// Insert sockets below",
    "insertModels": true,
    "registerModelsFile": "server/sqldb/index.js",
    "modelsNeedle": "// Insert models below",
    "filters": {
      "js": true,
      "babel": true,
      "jade": true,
      "css": true,
      "uirouter": true,
      "bootstrap": true,
      "uibootstrap": true,
      "socketio": true,
      "auth": true,
      "models": true,
      "mongooseModels": true,
      "mongoose": true,
      "gulp": true,
      "jasmine": true,
      "mocha": false,
      "should": false,
      "expect": false
    }
  },
  "generator-ng-component": {
    "routeDirectory": "client/app/",
    "directiveDirectory": "client/app/",
    "componentDirectory": "app/components/",
    "filterDirectory": "client/app/",
    "serviceDirectory": "client/app/",
    "basePath": "client",
    "moduleName": "",
    "modulePrompt": true,
    "filters": [
      "uirouter",
      "jasmine",
      "uirouter",
      "es6"
    ],
    "extensions": [
      "babel",
      "js",
      "jade",
      "css"
    ],
    "directiveSimpleTemplates": "",
    "directiveComplexTemplates": "",
    "filterTemplates": "",
    "serviceTemplates": "",
    "factoryTemplates": "",
    "controllerTemplates": "",
    "componentTemplates": "",
    "decoratorTemplates": "",
    "providerTemplates": "",
    "routeTemplates": ""
  }
}

As i added new routes and new views it seems to load the nav view successfully however at the same time another template which used to be loading, doesn't load.and this behaviour is random.For you information i am using jade template

biks152207 commented 8 years ago

still same issue i upgraded generator-angular-fullstack and created app with yo angular-fullstack but the issue is same in dist folder.moreover each time i generate the project i have to remove inject:css task from gulp since this task is defined two times.Am i supposed to update generator-angular-fullstack with npm install generator-angular-fullstack -g and create the project with yo angular-fullstack [appName],isn't it?

Koslun commented 8 years ago

Might be related to #1928, but seems like a Windows-specific issue.

Otherwise no errors in the console when using gulp build, gulp test, gulp serve or gulp serve:dist? And gulp serve works without issues in the browser too?

Only configuration I figure could be unusual is the CSS choice over any pre-processor. At the very least most other configurations does seem to work, so want to rule out whether it's a bug with this particular scaffolding configuration or a bug somehow introduced in your project. Can you confirm that you have this same issue with a newly scaffolded project (using the same settings)?

Would also re-check that your update of the generator stuck by doing a npm list -g --depth=0 command or looking at the .yo-rc.json file generated. Have personally had issues before where the update somehow didn't go through.

biks152207 commented 8 years ago

if you have time then pls try cloning this repo and run gulp dist and gulp serve:dist downloading all the npm and bower_components.I am middle of my project.and as i found this issue..template not found 404 issue, i am stuck. the repo is https://github.com/biks152207/issue

Koslun commented 8 years ago

Tried it. Reproduced the error you described on Node 4.4.4, npm 3.8.9, Ubuntu 15.10, MongoDB 3.0.2. So doesn't seem like it's something specific to your workspace.

Got 404's to settings and signups but did manage to get to the signup page through a different link. I.e. the signup button on the login page failed to link properly but the signup link in the navbar worked ok.

There should not be any requests for the HTML partials to begin with. They should have all been loaded upon first load. So for some reason some links point to static content rather than regular angular ui-router links.

I would try to reproduce the login or signup page case where either the buttons work and the navbar links do, or the reverse, in which case I would inspect and see if there were any differences. Would also try generating a fresh project to see if the error exists there too. Don't have time for either today though.

ingoncalves commented 8 years ago

Key @biks152207, I downloaded and ran your project but can not reproduces this issue. But I had this same problem described by you and I found the reason. In gulp file, the build:client fires transpile:client and html tasks in parallel, but the html task uses the output from transpile:client. So, the soluction is to run these task in serial mode. transpile:client first html later

Edit these lines:

466:    gulp.task('build:client', ['styles', 'html', 'constant', 'build:images'] ...

496:    gulp.task('html', ['transpile:client']...

This edit fixed my problem.