Closed JaKXz closed 10 years ago
I'm not great with Grunt, but here's my Gruntfile, I'd appreciate tips on what I might be missing.
I'll need the console log after running the grunt build
task to be able to help.
@DaftMonk Updated my gist, here's the output.
Hmm, there doesn't seem to be anything obviously wrong with the log. Could you check that the '.tmp/concat/scripts/vendor.js' file is not empty?
@DaftMonk it's empty as well.
Ah now I see the problem.
app/views/bower_components/angular-resource/angular-resource.js
Its looking for app/views/bower_components
, it should be app/bower_components
.
This is because the angular generator has a slightly different file structure, so the usemin paths in their index.html are different.
Change your build tags to:
<!-- build:css(app) styles/vendor.css -->
<!-- bower:css -->
<!-- endbower -->
<!-- endbuild -->
<!-- build:css({.tmp,app}) styles/main.css -->
<!-- build:js(app) scripts/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<!-- endbuild -->
@DaftMonk Thanks, that worked.
I also had the same problem, following upgrade of grunt-bower-install
to 1.4.0
. Unfortunately my tags were as listed above and it still created empty file. After some playing around I figured out that removing '(app)' resolves the problem. My current blocks look as follows:
<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<!-- endbuild -->
<!-- build:js({.tmp,app}) scripts/scripts.js -->
<!-- endbuild -->
On my app I needed to switch to
<!-- build:js(app/..) scripts/vendor.js -->
because my bwoer_compents dir is per default in /bower_components.
So any explainations what I did wrong?
@dei79 what are the contents of your .bowerrc
file?
I had the exact same problem as @dei79 and switching to <!-- build:js(app/..) scripts/vendor.js -->
was what I had to do as well. This is from a default yo angular
setup with no modifications. The contents of my .bowerrc
file is just:
{
"directory": "bower_components"
}
This is the content of my bowerrc
{
"directory": "bower_components"
}
I tried also other locations e.g. app/bower_components but this ends up with a corrupt path in the index.html
This problem still exists, but the solution is now to not include (app) in the build tags, but to instead include (./) in the build tags. And this fix is required for both the vendor.js and vendor.css files. The updated tags in index.html would then look like:
<!-- build:js(./) scripts/vendor.js -->
<!-- bower:js -->
...
<!-- endbower -->
<!-- endbuild -->
AND
<!-- build:css(./) styles/vendor.css -->
<!-- bower:css -->
...
<!-- endbower -->
<!-- endbuild -->
Looks like this issue is still open, but the fix is no big deal.
The problem comes from the last release where the bower_components directory has been moved the /project_root directory (see https://github.com/yeoman/generator-angular/blob/master/CHANGELOG.md#breaking-changes).
A quick and simple patch is to add the /project_root directory as an alternate path to the vendor.js useminPrepare block. @dei79 's <!-- build:js(app/..) scripts/vendor.js -->
patch works just fine. Personally, I used <!-- build:js(.) scripts/vendor.js -->
.
@jrmlstf works for me :+1:
<!-- build:js(app/..) scripts/vendor.js -->
also works for me
<!-- build:js(./) scripts/vendor.js -->
This worked for me.
tried above but still had issues with main.css. What worked finally was following:
for styles
<!-- build:css({.tmp,./}) styles/vendor.css -->
<!-- build:css({.tmp,app}) styles/main.css -->
for scripts
<!-- build:js({.tmp,./}) scripts/vendor.js -->
Hello, I have created an angular-generator-fullstack and deployed on Heroku (and working) but when I try to add some module (like ´ui.bootstrap´) doesn´t work on Heroku.
I have update my index.html with:
<!-- build:css(app) styles/vendor.css -->
... and
<!-- build:js(app) scripts/vendor.js -->
and if I run: << grunt serve:dist
works
but when I try to deploy on Heroku I dont know what happen, but doesnt work. I have my vendor.css and vendor.js empty (this is the url: http://eahtest.herokuapp.com/ )
Thank you in advance!!
@wikett have you tried the approaches mentioned above? Try this:
<!-- build:js(./) scripts/vendor.js -->
and <!-- build:css(./) scripts/vendor.css -->
@AnalogWeapon I have tried your approach but doesnt work :S
Same issue here, with the newest version of generator-angular
<!-- build:js(app/..) scripts/vendor.js -->
worked, but should not be necessary, so i guess the ticket should be reopened...
@madskonradsen Could you explain your specific issue a bit more? Are you using 2.0 of the angular-fullstack generator?
@DaftMonk Oh yeah, sorry! my vendor.js-file comes out empty when i run "grunt build"
The
and
approach worked for me as well.
(I was using generator-angular 0.9.0-1...)
I'm sorry! I thought that generator-angular was updated to the new version... It worked perfectly after updating...
I have the same issue. The generated vendor.js file is blank.
I did a gist https://gist.github.com/stephaneeybert/ada08c9917fad44a8e38
@stephaneeybert you should update the generator: npm update -g generator-angular-fullstack
There is a much newer version :)
@stephaneeybert and while you're at it you'll probably want to run npm update -g yo grunt bower
just to be safe. Wouldn't hurt to get the newest versions. I know that the newest version of generator-angular-fullstack
requires yo@1.2.0
@kingcody I did and it went fine, somewhat silent. stephane@stephane-ThinkPad-X60:nitro-project> npm update -g generator-angular-fullstack stephane@stephane-ThinkPad-X60:nitro-project>
On the other hand the second command was very verbose. npm update -g yo grunt bower
I then ran a grunt build again, only to have the same issue.
Thanks anyway for the updating tip.
I was also getting the "Uncaught ReferenceError: angular is not defined" after trying to set everything up, but doing a quick "grunt build" fixed it. Now everything is working!
My question is, I won't have to constantly enter this command in correct? (Let's say I'm adding some new files / etc)
I spent lots and lots of frustrated days because of this. I am using generator-angular-fullstack version 3.0.2. For me the css files in the routes were getting loaded fine
(i.e. <!-- build:css({.tmp,client}) app/app.css -->
), but the vendor.css was empty. Bootstrap and font-awesome were not getting loaded. Original line which was buggy was
<!-- build:css({client}) app/vendor.css -->
And for me it worked after I changed it to,
<!-- build:css({.tmp,client}) app/vendor.css -->
This small thing was not easy to find though. Found a lot of help in this thread. Cheers everyone! I can sleep in peace.
I have spent a day on this as well on version 3.1.1. If anyone still has this problem see if you have a space between: <!-- build:js
Space({.tmp,assets}) js/scripts.js -->
. It will not work with a space there.
I've been trying to deploy my app to heroku using the given steps, but unfortunately, my
dist/public/scripts/*.vendor.js
is completely empty (and as a result I get this error:Uncaught ReferenceError: angular is not defined 5ee656d2.scripts.js:1
). I took the code block below from myindex.html
and I haven't modified my Gruntfile since generating the project. What am I missing?One thing to note: I did start the project with just the yeoman angular generator, and then merged in the angular-fullstack later on... my app works fine locally, but is that where the issue is coming from?
What would be really cool is if components like angular could have a CDN url specified in production, with these files being the fallback.