GithubHelp home page GithubHelp logo

angular-fullstack / generator-angular-fullstack Goto Github PK

View Code? Open in Web Editor NEW
6.1K 270.0 1.2K 10.1 MB

Yeoman generator for an Angular app with an Express server

Home Page: https://awk34.gitbook.io/generator-angular-fullstack

JavaScript 87.98% CSS 0.96% HTML 5.47% Shell 0.61% TypeScript 2.77% Handlebars 0.30% Less 0.63% SCSS 0.71% Stylus 0.57% Procfile 0.01%
yeoman-generator javascript mongodb angular yeoman sequelize typescript babel pug sass

generator-angular-fullstack's Introduction

The Angular Full-Stack Generator

Build Status npm version Dependency Status Dev-Dependency Status Gitter chat

Yeoman generator for creating MEAN/SEAN stack applications, using ES2017, MongoDB/SQL, Express, Angular, and Node - lets you quickly set up a project following best practices.

Generated project:

Dependency Status Dev-Dependency Status Known Vulnerabilities

Usage

Install yo, gulp-cli, and generator-angular-fullstack:

npm install -g yo gulp-cli generator-angular-fullstack

Please note: If you run into trouble compiling native add-ons during the installation, follow node-gyp's short guide on required compilation tools.

Then, to run your app (make sure the MongoDB daemon is running if you selected Mongo), run the following to start your server:

npm run start:server

and the following to start the Webpack dev server for the front-end:

npm run start:client

The Webpack server will tell you which port to access the app at (usually http://localhost:8080/).

Run yo angular-fullstack

yo angular-fullstack

See the Getting Started guide for more information.

Prerequisites

  • MongoDB - Download and Install MongoDB - If you plan on scaffolding your project with mongoose, you'll need mongoDB to be installed and have the mongod process running.
    • If you have Docker installed, you can easily run a test database with docker run -p 27017:27017 --name afs-mongo -d mongo
  • The project's JavaScript is written in ECMAScript 2015. If you're unfamiliar with the latest changes to the specification for JavaScript, check out http://es6-features.org/

Supported Configurations

General

  • Build Systems: Gulp
  • Testing:
    • Jasmine
    • Mocha + Chai + Sinon
      • Chai assertions:
        • Expect
        • Should

Client

  • Scripts: JavaScript (Babel), TypeScript
  • Module Systems: Webpack
  • Markup: HTML, Pug
  • Stylesheets: CSS, Stylus, Sass, Less
  • CSS Frameworks: Bootstrap
    • Option to include UI Bootstrap

Server

  • Scripts: JavaScript (Babel), TypeScript (planned)
  • Database:
    • None,
    • MongoDB, SQL
      • Authentication boilerplate: Yes, No
      • oAuth integrations: Facebook, Twitter, Google
      • Socket.io integration: Yes, No

Generators

Available generators:

Documentation

Check out our documentation home page.

Contribute

See the contributing docs

When submitting an issue, please follow the Yeoman issue guidelines. Especially important is to make sure Yeoman is up-to-date, and providing the command or commands that cause the issue, as well as any stack traces.

License

BSD license

generator-angular-fullstack

generator-angular-fullstack's People

Contributors

addyosmani avatar andrewstuart avatar aniknafs avatar awk34 avatar azayzel avatar balthazar avatar benmarten avatar btford avatar daftmonk avatar david-mohr avatar dciccale avatar eddiemonge avatar greenkeeperio-bot avatar jaguarus83 avatar jeef3 avatar kevva avatar kingcody avatar koslun avatar meedamian avatar nstuyvesant avatar passy avatar programmerdave avatar robinboehm avatar rohita77 avatar samaxes avatar sindresorhus avatar sleeper avatar stherrienaspnet avatar zeripath avatar zfarrell avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

generator-angular-fullstack's Issues

Add option to write express app in coffee

Hello,

I noticed that the coffee option works only for frontend Javascript.

It will be nice to have an option to output the Express app and routes in Coffeescript.

dependency broken

On a fresh install of node :
npm install -g yo
npm install -g generator-angular-fullstack

yo angular-fullstack --jade
with no to compass and yes for all the others; results in :

"npm ERR! peerinvalid The package karma does not satisfy its siblings' peerDepend
encies requirements!
npm ERR! peerinvalid Peer [email protected] wants karma@>=0.9
npm ERR! peerinvalid Peer [email protected] wants karma@>=0.9
npm ERR! peerinvalid Peer [email protected] wants karma@~0.10.0

npm ERR! System Windows_NT 6.1.7601
npm ERR! command "C:\Program Files\nodejs\node.exe" "C:\Program Files\nod
ejs\node_modules\npm\bin\npm-cli.js" "install"
npm ERR! cwd c:\www\projs\generator-test\last-test-fullstack
npm ERR! node -v v0.10.24
npm ERR! npm -v 1.3.21
npm ERR! code EPEERINVALID
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! c:\www\projs\generator-test\last-test-fullstack\npm-debug.log
npm ERR! not ok code 0"

peerinvalid Peer [email protected] wants generator-karma@~0.5.0

I just tried running npm install -g generator-angular-fullstack

And got this error:

npm ERR! peerinvalid The package generator-karma does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer [email protected] wants generator-karma@~0.5.0
npm ERR! peerinvalid Peer [email protected] wants generator-karma@~0.6.0

npm ERR! System Darwin 12.5.0
npm ERR! command "node" "/usr/local/bin/npm" "install" "-g" "generator-angular-fullstack"
npm ERR! cwd /Users/dbaron/projects
npm ERR! node -v v0.10.21
npm ERR! npm -v 1.3.11
npm ERR! code EPEERINVALID

Grunt Serve events.js:72 Error

Hi there, having this issue when trying to run 'grunt serve'. I installed through yeoman.

events.js:72
throw er; // Unhandled 'error' event
^
Error: failed to connect to [localhost:27017]
at null.<anonymous> (/Users/mike/Sites/fullstack/node_modules/mongoose/node_modules/mongodb/lib/mongodb/connection/server.js:536:74)
at EventEmitter.emit (events.js:106:17)
at null.<anonymous> (/Users/mike/Sites/fullstack/node_modules/mongoose/node_modules/mongodb/lib/mongodb/connection/connection_pool.js:140:15)
at EventEmitter.emit (events.js:98:17)
at Socket.<anonymous> (/Users/mike/Sites/fullstack/node_modules/mongoose/node_modules/mongodb/lib/mongodb/connection/connection.js:478:10)
at Socket.EventEmitter.emit (events.js:95:17)
at net.js:441:14
at process._tickCallback (node.js:415:13)

Bootstrap less

Is there a specific reason to not include the option of using bootstrap less? Currently, one running the generator, one gets to choose between plain CSS or SASS/SCSS.

Upstream changes

You might want to consider stripping out the generator-angular specific part from this and turn it into a pure express generator. I've been trying to make changes in the angular generator to allow it to do this (work as a complete sub-generator). If there are reasons why this wouldn't work, I'd love to hear them so additional changes could be made.

Grunt serve not working

When I run 'grunt serve' I get:

Warning: Task "serve" not found. Use --force to continue.

Using 'grunt server' works. Is the readme wrong?

npm hash bug @1.2.0

npm http GET https://registry.npmjs.org/generator-angular-fullstack
npm http 304 https://registry.npmjs.org/generator-angular-fullstack
npm http GET https://registry.npmjs.org/generator-angular-fullstack/-/generator-angular-fullstack-1.2.0.tgz
npm http 200 https://registry.npmjs.org/generator-angular-fullstack/-/generator-angular-fullstack-1.2.0.tgz
npm ERR! Error: shasum check failed for /Users/fantasywind/tmp/npm-32119-LFKUcfAP/1389545335836-0.7862351867370307/tmp.tgz
npm ERR! Expected: 64c3cae6c4821887ccf5361d3bdacf14ab43606d
npm ERR! Actual:   d3cba4b72f16fe3b7a61839f484c4367c53ee487
npm ERR!     at /Users/fantasywind/.nvm/v0.10.24/lib/node_modules/npm/node_modules/sha/index.js:38:8
npm ERR!     at ReadStream.<anonymous> (/Users/fantasywind/.nvm/v0.10.24/lib/node_modules/npm/node_modules/sha/index.js:85:7)
npm ERR!     at ReadStream.EventEmitter.emit (events.js:117:20)
npm ERR!     at _stream_readable.js:920:16
npm ERR!     at process._tickCallback (node.js:415:13)

feat(gen): Add option for generating jade views using --jade

Similar to how the --coffee command works, adding --jade to the app/view/route commands should allow you to generate jade views. Now that the default rendering engine is EJS for serving html pages, it should be much easier to add in this functionality.

grunt serve:dist not copying js / css files to public folder

This may not be a bug as such, but it isn't working out-of-the-box, although I am on cloud9 so have to tinkle to make it work in the first place.

My Gruntfile: http://jsfiddle.net/Xpa62/

Relevant directory structure:
source
|-app
| |-bower_components
| |-fonts
| |-images
| |-scripts
| | |-controllers
| | | |-dashboard.js
| | | |-login.js
| | | |-settings.js
| | |-app.js
| |-styles
| | |-bootstrap-responsive.css
| | |-bootstrap.css
| | |-flat-ui.css
| |-views
| | |-...lots of jade files and two directories of jade files: partials, template
| |-favicon.ico
| |-robots.txt
|-public (empty pre-build)
|-views (empty pre-build)
|-.tmp (empty pre-build)

After running the build:
public
|-bower_components
| |-...the complete bower_components folder from before
|-fonts
| |-... all the fonts from above
|-favicon.ico
|-robots.txt

views
...All the jade files from before, but usemin tags and rev processes have made seemingly accurate modifications

.tmp
|-styles
| |-bootstrap-responsive.css
| |-bootstrap.css
| |-flat-ui.css

Now, I appreciate this may not be a bug in the software, but I am at my wits end debugging it so would appreciate some advice, or at least an explanation of where the files should be copied across in the build process so that I can debug further.

Cannot install: npm ERR! Error: shasum check failed

I get the following error when I run the install command:

npm install -g generator-angular-fullstack
npm http GET https://registry.npmjs.org/generator-angular-fullstack
npm http 304 https://registry.npmjs.org/generator-angular-fullstack
npm http GET https://registry.npmjs.org/generator-angular-fullstack/-/generator-angular-fullstack-1.2.0.tgz
npm http 200 https://registry.npmjs.org/generator-angular-fullstack/-/generator-angular-fullstack-1.2.0.tgz
npm ERR! Error: shasum check failed for /var/folders/zv/32jxd3d96x77qnd_wrhhg6q00000gn/T/npm-55977-irCte8hl/1389531052087-0.5481911019887775/tmp.tgz
npm ERR! Expected: 64c3cae6c4821887ccf5361d3bdacf14ab43606d
npm ERR! Actual:   d3cba4b72f16fe3b7a61839f484c4367c53ee487
npm ERR!     at /usr/local/Cellar/node/0.10.24/lib/node_modules/npm/node_modules/sha/index.js:38:8
npm ERR!     at ReadStream.<anonymous> (/usr/local/Cellar/node/0.10.24/lib/node_modules/npm/node_modules/sha/index.js:85:7)
npm ERR!     at ReadStream.EventEmitter.emit (events.js:117:20)
npm ERR!     at _stream_readable.js:920:16
npm ERR!     at process._tickCallback (node.js:415:13)
npm ERR! If you need help, you may report this *entire* log,
npm ERR! including the npm and node versions, at:
npm ERR!     <http://github.com/isaacs/npm/issues>

npm ERR! System Darwin 13.0.0
npm ERR! command "/usr/local/Cellar/node/0.10.24/bin/node" "/usr/local/bin/npm" "install" "-g" "generator-angular-fullstack"
npm ERR! cwd /Users/user1/code/mean/yo-mean
npm ERR! node -v v0.10.24
npm ERR! npm -v 1.3.21
npm ERR! 
npm ERR! Additional logging details can be found in:
npm ERR!     /Users/user1/code/mean/yo-mean/npm-debug.log
npm ERR! not ok code 0

feat(test): Add testing support for server.

Add mocha test folder for testing server code. grunt test would run through all the mocha tests in addition to the client side karma tests.

Could be integrated with server side generators for automatically generating routes with tests.

Comment on the first line of Gruntfile.js no longer lists date and generator

When using generator-angular-fullstack 1.0.1, the first line of the generated Gruntfile.js was:

// Generated on 2013-12-22 using generator-angular-fullstack 1.0.1

However, now that I've upgraded generator-angular-fullstack to 1.2.3, the first line of Gruntfile.js states:

// Generated on <%= (new Date).toISOString().split('T')[0] %> using <%= pkg.name %> <%= pkg.version %>

feat(gen): Sub-Generator for REST URLs

Generates boilerplate for creating a new rest URL. Would generate GET/POST/PUT/UPDATE/DELETE routes following standard REST format. Would link routes to a generated controller file.

I have this error

module.js:340
throw err;
^
Error: Cannot find module '/Users/yordisprieto/Sites/biblove/biblove/app'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Function.Module.runMain (module.js:497:10)
at startup (node.js:119:16)
at node.js:901:3

feat(rest): Add Passport support

I was thinking of creating a pull request to add Passport as an OAuth module for server side rest application. Of course I would make it optional. Is this valuable?

media screen issue

in main.scss

line: 71

@media screen and (min-width: 768px) {
.container {
max-width: 730px;
}
...

This seems to interfere with desktop apps going beyond 768px Should this be a max-width check instead?

Planning to remove duplicate generators

Currently all the sub generators from generator-angular are included with this generator with the alias of "angular-fullstack". This seems unnecessary.

I believe this generator would be much better focused singularly as a tool to scaffold the project and generate server files.

It would of course be full compatible with the "generator-angular" sub generators, and could be used hand and hand with them.

I think this change is important because it would be:

  • Easier to maintain
  • Makes the documentation less confusing
  • Project becomes more independent

I'd be happy to hear any feedback about this and would be open to changing my mind.

Angular 1.2

Hi,
is it possible to make it sync with the latest generator-angular version, offering Angular ~1.2.0 ?

feat(app): Add default routing to index.html to allow for refresh on HTML5 routes

Angular's HTML5 mode overrides the default routing, so routes that appear valid only exist when you visit them after initializing the app.

This means if I were to set up an angular route called /about and tried going to localhost, then clicking on a link to /about, everything would work. But if I tried refreshing once I was on the localhost/about page, or going directly to localhost/about I would get a 404.

To fix this I will set all unspecified server routes to go to index.html. This will also require a rendering engine such as EJS to render the html page on request.

Jade template Engine

Hi,
the option to support Jade template doesn't work for me.
Neither while creating the app or asking for a new view.
No errors in console, and only .html files for views.
ex : yo angular-fullstack --jade or yo angular-fullstack:view user --jade.

  • Yeoman (1.0.4)
  • Angular generator (0.6.0-rc.2)
  • Angular-fullstack generator (0.2.0)

I need to manually git add/commit before pushing to Heroku

I have set up Heroku deployment with yo angular-fullstack:deploy heroku.

But every time I do a grunt build, I need to do:

cd dist # as in Readme
git add .
git commit -m 'New version for Heroku'
git push heroku master # as in Readme

Is this the way it's supposed to be?

Suggestion: Include "MEAN" in the generator description

I've played around with the different mean stack generators that yeoman provides, as well as the mean.io project and by accident I've now found your generator which is pretty much exactly what I was after, i.e. the right balance between bloat and nakedness ;)

My problem was that I was searching the generators yeoman for "mean" rather than "fullstack". I figured there might be more lost souls wandering around trying to find you. The small edit to the generator description might help.

Btw, really looking forward to messing with the new version including passport you have coming out!

Thank you!

--coffee=false breaks for :route

yo angular-fullstack:route name --coffee=false
Error: ENOENT, no such file or directory '/Users/M/Apps/app-name/app/scripts/app.js'

Setting Up mongo

Im pretty sure this is a user error. I am trying to connect to a local database and I change the development url in the congfiguration to point to my local instance, but when I run grunt serve I get an error saying required MongoStore option db missing. This looks like an awesome package and thank you for putting it together I just need some help getting started!

`!!!` is deprecated, you must now use `doctype` error

After executing these commands:

yo angular-fullstack --jade
grunt serve

The following error is displayed in the browser:

Error: /home/todd/MyToDo/app/views/index.jade:1 > 1| !!! 2| // [if lt IE 7]> <![endif] 3| // [if IE 7]> <![endif] 4| // [if IE 8]> <![endif] !!! is deprecated, you must now use doctype at Object.Lexer.doctype (/home/todd/MyToDo/node_modules/jade/lib/lexer.js:246:13) at Object.Lexer.next (/home/todd/MyToDo/node_modules/jade/lib/lexer.js:812:15) at Object.Lexer.lookahead (/home/todd/MyToDo/node_modules/jade/lib/lexer.js:111:46) at Parser.lookahead (/home/todd/MyToDo/node_modules/jade/lib/parser.js:109:23) at Parser.peek (/home/todd/MyToDo/node_modules/jade/lib/parser.js:86:17) at Parser.parse (/home/todd/MyToDo/node_modules/jade/lib/parser.js:124:26) at parse (/home/todd/MyToDo/node_modules/jade/lib/jade.js:95:62) at Object.exports.compile (/home/todd/MyToDo/node_modules/jade/lib/jade.js:152:9) at Object.exports.render (/home/todd/MyToDo/node_modules/jade/lib/jade.js:256:15) at Object.exports.renderFile (/home/todd/MyToDo/node_modules/jade/lib/jade.js:293:18)

Executing these commands produces no error (no jade option):

yo angular-fullstack
grunt serve


yo --version && echo $PATH $NODE_PATH && node -e 'console.log(process.platform, process.versions)' && cat Gruntfile.js
1.0.7-pre.2
/usr/local/heroku/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games
linux { http_parser: '1.0',
node: '0.10.15',
v8: '3.14.5.8',
ares: '1.10.0',
uv: '0.10.13',
zlib: '1.2.8',
modules: '11',
openssl: '1.0.1e' }
// Generated on 2013-12-25 using generator-angular-fullstack 1.0.1
'use strict';

// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,/}.js'
// use this if you want to recursively match all subfolders:
// 'test/spec/*/.js'

module.exports = function (grunt) {

// Load grunt tasks automatically
require('load-grunt-tasks')(grunt);

// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);

// Define the configuration for all the tasks
grunt.initConfig({

// Project settings
yeoman: {
  // configurable paths
  app: require('./bower.json').appPath || 'app',
  dist: 'public',
  views: 'views'
},
express: {
  options: {
    port: process.env.PORT || 9000
  },
  dev: {
    options: {
      script: 'server.js'
    }
  },
  prod: {
    options: {
      script: 'server.js',
      node_env: 'production'
    }
  }
},
open: {
  server: {
    url: 'http://localhost:<%= express.options.port %>'
  }
},
watch: {
  js: {
    files: ['{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js'],
    tasks: ['newer:jshint:all']
  },
  jsTest: {
    files: ['test/spec/{,*/}*.js'],
    tasks: ['newer:jshint:test', 'karma']
  },
  compass: {
    files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
    tasks: ['compass:server', 'autoprefixer']
  },
  livereload: {
    files: [
      '<%= yeoman.app %>/<%= yeoman.views %>/{,*//*}*.{html,jade}',
      '{.tmp,<%= yeoman.app %>}/styles/{,*//*}*.css',
      '{.tmp,<%= yeoman.app %>}/scripts/{,*//*}*.js',
      '<%= yeoman.app %>/images/{,*//*}*.{png,jpg,jpeg,gif,webp,svg}',
    ],
    options: {
      livereload: true
    }
  },
  express: {
    files: [
      'server.js',
      'lib/{,*//*}*.{js,json}'
    ],
    tasks: ['express:dev'],
    options: {
      livereload: true,
      nospawn: true //Without this option specified express won't be reloaded
    }
  },
  styles: {
    files: ['<%= yeoman.app %>/styles/{,*/}*.css'],
    tasks: ['newer:copy:styles', 'autoprefixer']
  },
  gruntfile: {
    files: ['Gruntfile.js']
  }
},

// Make sure code styles are up to par and there are no obvious mistakes
jshint: {
  options: {
    jshintrc: '.jshintrc',
    reporter: require('jshint-stylish')
  },
  all: [
    '<%= yeoman.app %>/scripts/{,*/}*.js'
  ],
  test: {
    options: {
      jshintrc: 'test/.jshintrc'
    },
    src: ['test/spec/{,*/}*.js']
  }
},

// Empties folders to start fresh
clean: {
  dist: {
    files: [{
      dot: true,
      src: [
        '.tmp',
        '<%= yeoman.views %>/*',
        '<%= yeoman.dist %>/*',
        '!<%= yeoman.dist %>/.git*'
      ]
    }]
  },
  heroku: {
    files: [{
      dot: true,
      src: [
        'heroku/*',
        '!heroku/.git*',
        '!heroku/Procfile'
      ]
    }]
  },
  server: '.tmp'
},

// Add vendor prefixed styles
autoprefixer: {
  options: {
    browsers: ['last 1 version']
  },
  dist: {
    files: [{
      expand: true,
      cwd: '.tmp/styles/',
      src: '{,*/}*.css',
      dest: '.tmp/styles/'
    }]
  }
},




// Compiles Sass to CSS and generates necessary files if requested
compass: {
  options: {
    sassDir: '<%= yeoman.app %>/styles',
    cssDir: '.tmp/styles',
    generatedImagesDir: '.tmp/images/generated',
    imagesDir: '<%= yeoman.app %>/images',
    javascriptsDir: '<%= yeoman.app %>/scripts',
    fontsDir: '<%= yeoman.app %>/styles/fonts',
    importPath: '<%= yeoman.app %>/bower_components',
    httpImagesPath: '/images',
    httpGeneratedImagesPath: '/images/generated',
    httpFontsPath: '/styles/fonts',
    relativeAssets: false,
    assetCacheBuster: false
  },
  dist: {
    options: {
      generatedImagesDir: '<%= yeoman.dist %>/images/generated'
    }
  },
  server: {
    options: {
      debugInfo: true
    }
  }
},

// Renames files for browser caching purposes
rev: {
  dist: {
    files: {
      src: [
        '<%= yeoman.dist %>/scripts/{,*/}*.js',
        '<%= yeoman.dist %>/styles/{,*/}*.css',
        '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
        '<%= yeoman.dist %>/styles/fonts/*'
      ]
    }
  }
},

// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
  html: ['<%= yeoman.app %>/<%= yeoman.views %>/index.html',
         '<%= yeoman.app %>/<%= yeoman.views %>/index.jade'],
  options: {
    dest: '<%= yeoman.dist %>'
  }
},

// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
  html: ['<%= yeoman.views %>/{,*/}*.html',
         '<%= yeoman.views %>/{,*/}*.jade'],
  css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
  options: {
    assetsDirs: ['<%= yeoman.dist %>']
  }
},

// The following *-min tasks produce minified files in the dist folder
imagemin: {
  dist: {
    files: [{
      expand: true,
      cwd: '<%= yeoman.app %>/images',
      src: '{,*/}*.{png,jpg,jpeg,gif}',
      dest: '<%= yeoman.dist %>/images'
    }]
  }
},
svgmin: {
  dist: {
    files: [{
      expand: true,
      cwd: '<%= yeoman.app %>/images',
      src: '{,*/}*.svg',
      dest: '<%= yeoman.dist %>/images'
    }]
  }
},
htmlmin: {
  dist: {
    options: {
      // Optional configurations that you can uncomment to use
      // removeCommentsFromCDATA: true,
      // collapseBooleanAttributes: true,
      // removeAttributeQuotes: true,
      // removeRedundantAttributes: true,
      // useShortDoctype: true,
      // removeEmptyAttributes: true,
      // removeOptionalTags: true*/
    },
    files: [{
      expand: true,
      cwd: '<%= yeoman.app %>/<%= yeoman.views %>',
      src: ['*.html', 'partials/*.html'],
      dest: '<%= yeoman.views %>'
    }]
  }
},

// Allow the use of non-minsafe AngularJS files. Automatically makes it
// minsafe compatible so Uglify does not destroy the ng references
ngmin: {
  dist: {
    files: [{
      expand: true,
      cwd: '.tmp/concat/scripts',
      src: '*.js',
      dest: '.tmp/concat/scripts'
    }]
  }
},

// Replace Google CDN references
cdnify: {
  dist: {
    html: ['<%= yeoman.views %>/*.html']
  }
},

// Copies remaining files to places other tasks can use
copy: {
  dist: {
    files: [{
      expand: true,
      dot: true,
      cwd: '<%= yeoman.app %>',
      dest: '<%= yeoman.dist %>',
      src: [
        '*.{ico,png,txt}',
        '.htaccess',
        'bower_components/**/*',
        'images/{,*/}*.{webp}',
        'fonts/*'
      ]
    }, {
      expand: true,
      dot: true,
      cwd: '<%= yeoman.app %>/<%= yeoman.views %>',
      dest: '<%= yeoman.views %>',
      src: '**/*.jade',
    }, {
      expand: true,
      cwd: '.tmp/images',
      dest: '<%= yeoman.dist %>/images',
      src: [
        'generated/*'
      ]
    }]
  },
  heroku: {
    files: [{
      expand: true,
      dot: true,
      dest: 'heroku',
      src: [
        '<%= yeoman.dist %>/**',
        '<%= yeoman.views %>/**'
      ]
    }, {
      expand: true,
      dest: 'heroku',
      src: [
        'package.json',
        'server.js',
        'lib/**/*'
      ]
    }]
  },  
  styles: {
    expand: true,
    cwd: '<%= yeoman.app %>/styles',
    dest: '.tmp/styles/',
    src: '{,*/}*.css'
  }
},

// Run some tasks in parallel to speed up the build process
concurrent: {
  server: [
    'compass:server',
    'copy:styles'
  ],
  test: [
    'compass',
    'copy:styles'
  ],
  dist: [
    'compass:dist',
    'copy:styles',
    'imagemin',
    'svgmin',
    'htmlmin'
  ]
},

// By default, your `index.html`'s <!-- Usemin block --> will take care of
// minification. These next options are pre-configured if you do not wish
// to use the Usemin blocks.
// cssmin: {
//   dist: {
//     files: {
//       '<%= yeoman.dist %>/styles/main.css': [
//         '.tmp/styles/{,*/}*.css',
//         '<%= yeoman.app %>/styles/{,*/}*.css'
//       ]
//     }
//   }
// },
// uglify: {
//   dist: {
//     files: {
//       '<%= yeoman.dist %>/scripts/scripts.js': [
//         '<%= yeoman.dist %>/scripts/scripts.js'
//       ]
//     }
//   }
// },
// concat: {
//   dist: {}
// },

// Test settings
karma: {
  unit: {
    configFile: 'karma.conf.js',
    singleRun: true
  }
}

});

grunt.registerTask('express-keepalive', 'Keep grunt running', function() {
this.async();
});

grunt.registerTask('serve', function (target) {
if (target === 'dist') {
return grunt.task.run(['build', 'express:prod', 'open', 'express-keepalive']);
}

grunt.task.run([
  'clean:server',
  'concurrent:server',
  'autoprefixer',
  'express:dev',
  'open',
  'watch'
]);

});

grunt.registerTask('server', function () {
grunt.log.warn('The server task has been deprecated. Use grunt serve to start a server.');
grunt.task.run(['serve']);
});

grunt.registerTask('test', [
'clean:server',
'concurrent:test',
'autoprefixer',
'karma'
]);

grunt.registerTask('build', [
'clean:dist',
'useminPrepare',
'concurrent:dist',
'autoprefixer',
'concat',
'ngmin',
'copy:dist',
'cdnify',
'cssmin',
'uglify',
'rev',
'usemin'
]);

grunt.registerTask('heroku', [
'build',
'clean:heroku',
'copy:heroku'
]);

grunt.registerTask('default', [
'newer:jshint',
'test',
'build'
]);
};

Changes in express files breaks livereload

Hi there!

first of all congrats for this wonderful generator!
I noticed the following. If I make any changes to files under lib ( for express ), it does reload the browser but I get:

Oops! Google Chrome could not connect to localhost:9000

If I refresh manually it works ok with the changes made.
I know its not a big issue but thought it could be useful to know.

Thanks a lot!

grunt serve won't exit

'grunt serve' won't accept a ctrl-c. I just created a new project to test and I get the same behavior. Also, when I kill the process, it takes the shell with it.

Fatal error: No Bower components found.

I ran the following commands without error

npm install -g generator-angular-fullstack
mkdir newProject
cd newProject
yo angular-fullstack

and then ran

grunt serve

and received the following error

"Running "bower-install:app" (bower-install) task
Cannot find where you keep your Bower packages.

We tried looking for a .bowerrc file, but couldn't find a custom
directory property defined. We then tried bower_components, but
it looks like that doesn't exist either. As a last resort, we tried
the pre-1.0 components directory, but that also couldn't be found.

Unfortunately, we can't proceed without knowing where the Bower
packages you have installed are.

Fatal error: No Bower components found."

Not sure where to go from here.

feat(gen): Include MongoDB as an option

Add inclusion of Mongoose/MongoDB as an option during initlilization, defaults to not include. Sets up database with Mongoose. Would replace the static data returned from awesomeThings route with data from a query.

In the future we could have a list that would allow you to choose from a number of databases, such as PostgreSQL, SQLLite, MySQL.

Question: The new views system

Hi Tyler, thanks again for this generator!

I switched to the latest version today (1.0.1) and I noticed that the views are handled differently. In development, the "views" folder is under the "app" folder, but when I build the site, the "views" folder is placed at the same level as the "public" folder (aka dist). I don't really understand what is the benefit of doing this way, personally I find it a bit confusing (the same goes for the "heroku" target). Can you please tell me why did you considered moving the "views" folder up one level, maybe there's something I'm not seeing.

Secondly, I think having compatibility with "yo angular" was nice in the previous version. Now, with these changes, it's not possible to use this generator for creating routes, controllers, etc. and we have to use "yo angular-fullstack", which is a little longer :)

Cheers

Support for LESS

For those of us who would rather use LESS instead of SASS. :)

Grunt serve:dist keeps loading vendor.js

When I am trying to run application in distribution mode using grunt serve:dist vendor .js keeps loading infinitely. and finally page crashes. It works fine in normal development mode grunt:serve.

Warning: Task "karma" not found

When i run

$ grunt test

I receive the warning

Warning: Task "karma" not found. Use --force to continue.

Then

Aborted due to warnings.

I have installed karma as when i run

$ which karma

I get the output

/usr/local/bin/karma

I have tried installing karma as a node_module to the local directory without any luck.

Once thing that might be worth noting is that when running

$ npm ls

I receive the following errors

npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-chrome-launcher
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-firefox-launcher
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-html2js-preprocessor
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-jasmine
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-ng-html2js-preprocessor
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-ng-scenario
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-requirejs
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-script-launcher
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-coffee-preprocessor
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/grunt-karma
npm ERR! extraneous: [email protected] /Users/mrtomstone/Dev/bind/node_modules/karma-phantomjs-launcher
npm ERR! not ok code 0

Also, these modules do not seem to be listed in the package.json file.

Thanks

angular-fullstack bug

when i click angular-fullstack router generator he re-directed me to angular router instead of angular-fullstack router

feat(app): Move all html files into views folder

To make #17 possible, as well as to make future integration of other rendering engines like Jade easier, I'm going to isolate the html files into a views folder. This will result in angularJS views being moved into a partials subfolder, and index.html moved into views. App structure will be like this

  • app
    • scripts
    • styles
    • views
      • partials
      • index.html

And grunt build/grunt server:dist tasks will now build these folders in the root:

  • public
  • views

The views folder in the root will be the minified production ready views.

This will be a breaking change if you have an existing project that you need to use yo angular-fullstack:view or yo angular-fullstack:route on. If you have a project that needs those generators I'd suggest using the generator-angular version of those sub generators, yo angular:view, yo angular:route since they are exactly the same.

I think this is a necessary change because being able to use server rendering engines is an important feature to have.

npm install getting stuck

Just thought I'd post this here in case anyone else is experiencing this. npm install seems to be getting stuck for me sometimes:

> [email protected] postinstall C:\Users\Tyler\JSworkspace\finaltest\node_modules\g
runt-contrib-imagemin\node_modules\gifsicle
> node lib/check.js

  gifsicle.exe: downloading [===================] 100% 0.0s


√ pre-build test passed successfully

> [email protected] postinstall C:\Users\Tyler\JSworkspace\finaltest\node_module
s\grunt-contrib-imagemin\node_modules\optipng-bin
> node lib/check.js

  optipng.exe: downloading [===================] 100% 0.0s


√ pre-build test passed successfully

Hangs at the last line. If i end the process and try running grunt serve/build/test, they all work, but it's annoying that its not exiting cleanly. I don't know which dependency is causing this, but it might be a windows only problem.

feat(bower:install) - grunt-bower-task

add bower:install task to automagically bower install your bower components

npm package details: https://npmjs.org/package/grunt-bower-task

required config in Gruntfile.js (inserted before bower-install task)

    bower: {
        install: {
            options: {
                targetDir: '<%= yeoman.app %>',
            }
        }
    },

Error: Failed to lookup view "index" in views directory "/test/dist/app/views"

OS X:

init

$> yo angular-fullstack --coffee --jade
  • all yes ;)
$> grunt serve:dist

$> cd dist
$> node server.js

connect.multipart() will be removed in connect 3.0
visit https://github.com/senchalabs/connect/wiki/Connect-3.0 for alternatives
connect.limit() will be removed in connect 3.0
Express server listening on port 3000 in development mode
finished populating things
finished populating users

Chrome http://localhost:3000

...
Error: Failed to lookup view "index" in views directory "/test/dist/app/views"
...

'app' - unnecessary

Debugging with webstorm doesn't stop of breakpoints

Hi there,

Great generator! I found a small problem, it may not be associated with the generator but according to stackexchange I have setup the correct way of debugging a node.js controlled by grunt. I thought I may put my findings here, maybe somebody else is experiencing same issue or has a fix, or is it a known problem ?

I don't need debugging when developing angularjs but i have found i do need it when developing the backend part (express.js / node.js)

I am lost :-)

I setup debugging via this

http://stackoverflow.com/questions/17043484/grunt-debugging-from-webstorm?rq=1

Here is the output from webstorm, it takes a while for the browser to launch but eventually it launches and everything seems ok and I am able to view the site here http://localhost:9000/

But i have added breakpoints to controllers, server.js etc and nothing is hit.

Its a little suspect as I get "ReferenceError: Process is not defined" below but running from the the command line direct doesn't cause this problem.

"C:\Program Files\nodejs\node.exe" --debug-brk=61951 C:\Users\gregsoni\AppData\Roaming\npm\node_modules\grunt-cli\bin\grunt serve
debugger listening on port 61951
[ReferenceError: process is not defined]
Running "serve" task
[ReferenceError: process is not defined]
[ReferenceError: process is not defined]

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

Running "concurrent:server" (concurrent) task
[ReferenceError: process is not defined]
[ReferenceError: process is not defined]
[ReferenceError: process is not defined]
[ReferenceError: process is not defined]
[ReferenceError: process is not defined]
[ReferenceError: process is not defined]

Running "copy:styles" (copy) task

Done, without errors.

Running "compass:server" (compass) task
directory .tmp/styles/
create .tmp/styles/main.css (1.237s)
Compilation took 1.239s

Done, without errors.

Running "autoprefixer:dist" (autoprefixer) task
Prefixed file ".tmp/styles/main.css" created.

Running "express:dev" (express) task
Starting background Express server
connect.multipart() will be removed in connect 3.0
visit https://github.com/senchalabs/connect/wiki/Connect-3.0 for alternatives
connect.limit() will be removed in connect 3.0
Express server listening on port 9000 in development mode

Running "open:server" (open) task
Successfully connected to: mongodb://localhost/test
finished populating things

Running "watch" task
Waiting...GET / 304 10ms
GET /partials/main 304 2ms
GET /api/awesomeThings 200 8ms - 1.03kb

1.1.1 is the current latest version in npm

$ npm install -g [email protected]

npm http GET https://registry.npmjs.org/generator-angular-fullstack/1.2.0
npm http 404 https://registry.npmjs.org/generator-angular-fullstack/1.2.0
npm ERR! Error: version not found: 1.2.0 : generator-angular-fullstack/1.2.0

navigate to https://registry.npmjs.org/generator-angular-fullstack and will you see that the latest version is 1.1.1

dist-tags: {
    latest: "1.1.1"
},

$ npm view generator-angular-fullstack versions

[ '0.0.1',
  '0.0.2',
  '0.0.3',
  '0.0.4',
  '0.0.5',
  '0.1.0',
  '0.2.0',
  '1.0.0',
  '1.0.1',
  '1.1.0',
  '1.1.1' ]

Generated wrong path in index.html for controller script

the controller was generated using yo angular-fullstack:controller Employee

and the path that was injected to index.html as the script src was:
<script src="script\controllers\Employee.js"></script>

instead of:
<script src="script/controllers/Employee.js"></script>

I suspect this is due to me being on Windows (8.1) and that path.join resulted in a path that is correct for the os, but wrong for script forward slash syntax.

Any thoughts?

I think the problem is here: (script-base.js)

Generator.prototype.generateSourceAndTest = function (appTemplate, testTemplate, targetDirectory, skipAdd) {
  this.appTemplate(appTemplate, path.join('scripts', targetDirectory, this.name));
  this.testTemplate(testTemplate, path.join(targetDirectory, this.name));
  if (!skipAdd) {
    this.addScriptToIndex(path.join(targetDirectory, this.name));
  }
};

Option with MongDB not working

When I generate application using yo generator and answer y for question about MongoDB application cannot get data from api.

yo angular-fullstack:controller

I was wondering whether this should add the controller to this stanza automatically, or whether it's a design feature that the controllers aren't automatically included:

<!-- build:js({.tmp,app}) scripts/scripts.js -->
        <script src="scripts/app.js"></script>
        <script src="scripts/controllers/main.js"></script>
##        <script src="scripts/controllers/contact.js"></script>
##        <script src="scripts/controllers/about.js"></script>
<!-- endbuild -->

The two lines about (prefix'd with #) are the ones that I had to add manually.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.