Getting 404s for public/components assets when node env is production

[wolfeidau]

I have been hacking on a project using kraken and I have run into issues with the templates/css & bower components installed in the public directory.

I can get either to work but not both..

If i configure the middleware.json as follows:

    "static": {
      "srcRoot": "path:./public",
      "rootPath": "path:./.build"
    }

All the templates and css work but i get 404s for anything in public/components as it is trying to load it from ./build/components. Is this intentional?

If i configure middleware.json as follows:

    "static": {
      "srcRoot": "path:./public",
      "rootPath": "path:./public"
    }

Then templates work but css, specifically the files compiled by less don't load as it is looking for them in public/css. All of the stuff in ./public/components does work though.

Any ideas how to get both these working at the same time?

[lensam69]

Did you run 'grunt build' on your project?

[wolfeidau]

Yes running grunt build on deployment.

Running "jshint:files" (jshint) task
>> 4 files lint free.

Running "less:compile" (less) task
File .build/css/app.css created.

Running "clean:tmp" (clean) task

Running "clean:build" (clean) task
Cleaning .build/templates...OK

Running "makara:files" (makara) task

Running "dustjs:compile" (dustjs) task
[dustjs] Compiled .build/templates/US/en/index.js
[dustjs] Compiled .build/templates/US/en/layouts/master.js

Running "clean:tmp" (clean) task
Cleaning tmp...OK

Done, without errors.

So as mentioned templates work, css works but then it tries to serve all assets out of .build.

[lmarkus]

@wolfeidau I'm unable to reproduce this. Can you start with a fresh state: Remove your current version of the generator: sudo npm uninstall -g generator-kraken npm cache clean sudo npm install -g generator-kraken

Start a new project: yo kraken

With the latest version of the generator, you'll be asked if you want to use Require. Say yes.

Now run the project, and visit the home page. Require.js should be served out of ./public/components/requirejs/require.js

If it's still occurring can you provide a link to a GitHub repo that highlights the issue? Thanks!

[wolfeidau]

Sorry for not getting back to you.

I managed to get to the core of the issue, if you create a simple kraken project then install a bower dependency it won't be cached in .build/.

To remedy this you need to run grunt build which copies all these assets into the .build folder.

So before when getting 404s for angular.js

$ find .build/
.build/
.build//components
.build//components/requirejs
.build//components/requirejs/require.js
.build//css
.build//css/app.css
.build//js
.build//js/app.js
.build//js/config.js

After running grunt build.

$ find .build/
.build/
.build//components
.build//components/requirejs
.build//components/requirejs/require.js
.build//css
.build//css/app.css
.build//js
.build//js/.jshintignore
.build//js/.jshintrc
.build//js/angular.js
.build//js/app.js
.build//js/build.txt
.build//js/config.js
.build//templates
.build//templates/US
.build//templates/US/en
.build//templates/US/en/index.js
.build//templates/US/en/layouts
.build//templates/US/en/layouts/master.js

Hopefully this makes it clear as to why someone would experience this, it looks like during development some sort of middleware will be needed to integrate with require and perform this when a request is received.

Cheers

[jeffharrell]

This actually just needs to be documented better. Some of the processing doesn't happen during development because things are compiled/generated on the fly. They will get added to .build, but this is more a side effect than a solution.

If you're deploying to production you don't want to depend on having to hit every route beforehand to generate the necessary files. The proper way is to always do a grunt build to generate everything (plus we do some minification optimizations) and then start up in production mode.

[wolfeidau]

Yeah agree, currently we are just running the build step each team we do a bower install.

On our staging server we run:

npm install && grunt build

In the post deploy hook and it works great.

Only really trips up new users who are doing front end dev using kraken-js, which may or may not be your target audience..

Cheers

[jeffharrell]

Closing this out since it appears to be resolved.