thomasstreet / famous-angular-starter

Starter repo + walkthrough for Famo.us/Angular
114 stars 48 forks source link

Blank page after gulp serve:dist #6

Open Mabuti opened 10 years ago

Mabuti commented 10 years ago

Working with a clean clone of the repository I run the following:

git pull origin master npm install gulp watch gulp gulp serve:dist

Via the browser console I get the following errors:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/styles/vendor.css
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/famous-angular/dist/famous-angular.css
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/jquery/dist/jquery.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular/angular.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-animate/angular-animate.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-cookies/angular-cookies.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-touch/angular-touch.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-sanitize/angular-sanitize.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-resource/angular-resource.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-ui-router/release/angular-ui-router.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-route/angular-route.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/requirejs/require.js
Uncaught ReferenceError: require is not defined localhost:9000/:46
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/underscore/underscore.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/famous-angular/dist/famous-angular.js
Uncaught ReferenceError: angular is not defined localhost:9000/scripts/main-afd6cdfc.js:1

Obviously I am able to resolve all but the vendor.css error by just placing all the missing scripts in the appropriate dist folder but I do not think that is an intended fix. Thoughts?

flakyfilibuster commented 10 years ago

looks like bower install didn't run - which is the obvious solution for all BUT the vendor.css problem ...

joaomilho commented 10 years ago

Had the same problem. Any update?

surfjedi commented 10 years ago

I had same problem - the issue is the bower components are in the "app" folder and not copied into the "dist" folder . I worked around it by manually copying the "bower_components" folder into the dist folder. See next screen shot.

I'm sure there is a better way - by updating the build process..

surfjedi commented 10 years ago

famous-angular-starter-master

surfjedi commented 10 years ago

And a step better:

Add this task in gulp/build.js:

gulp.task('bowerjs', function() { return gulp.src('app/bowercomponents/*/_') .pipe(gulp.dest('dist/bower_components/')) });

Then add 'bowerjs' in the last build task at the end like below: gulp.task('build', ['haml', 'jade', 'html', 'partials', 'images', 'fonts', 'bowerjs']);

That will copy the files from the app folder to the dist folder on the gulp command, then run gulp serve:dist

This still isn't optimal but better, ideally you wire it up with wiredep but I haven't sorted that yet..

akarve commented 9 years ago

After following The More Powerful Way on a clean directory, doesn't work since <script> references in app/index.html expect bower_components to be in the same directory. Solution is similar to @surfjedi, but copy is in the other direction: copy root/bower_components to root/app, then it works.

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/famous-angular/dist/famous-angular.css
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular/angular.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-animate/angular-animate.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-cookies/angular-cookies.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-touch/angular-touch.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-sanitize/angular-sanitize.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-resource/angular-resource.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-ui-router/release/angular-ui-router.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/angular-route/angular-route.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/underscore/underscore.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/famous/famous-global.js
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/famous-angular/dist/famous-angular.js
Uncaught ReferenceError: angular is not defined famousAngularStarter.js:3
Uncaught ReferenceError: angular is not defined main-ctrl.js:3
Failed to load resource: net::ERR_CONNECTION_REFUSED http://localhost:35729/livereload.js?snipver=1
Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:9000/bower_components/famous-angular/dist/famous-angular.css