Skip to content

Commit 84f0926

Browse files
committed
initial commit, no options, but working
0 parents  commit 84f0926

25 files changed

+912
-0
lines changed

.editorconfig

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# http://editorconfig.org
2+
root = true
3+
4+
[*]
5+
indent_style = space
6+
indent_size = 2
7+
end_of_line = lf
8+
charset = utf-8
9+
trim_trailing_whitespace = true
10+
insert_final_newline = true
11+
12+
[*.md]
13+
trim_trailing_whitespace = false

.gitattributes

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
* text=auto

.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules/
2+
temp/
3+
.DS_Store

.jshintrc

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"node": true,
3+
"esnext": true,
4+
"bitwise": true,
5+
"camelcase": true,
6+
"curly": true,
7+
"eqeqeq": true,
8+
"immed": true,
9+
"indent": 2,
10+
"latedef": true,
11+
"newcap": true,
12+
"noarg": true,
13+
"quotmark": "single",
14+
"regexp": true,
15+
"undef": true,
16+
"unused": true,
17+
"strict": true,
18+
"trailing": true,
19+
"smarttabs": true,
20+
"white": true
21+
}

.travis.yml

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
language: node_js
2+
node_js:
3+
- '0.10'
4+
before_install:
5+
- currentfolder=${PWD##*/}
6+
- if [ "$currentfolder" != 'generator-gulp-angular' ]; then cd .. && eval "mv $currentfolder generator-gulp-angular" && cd generator-gulp-angular; fi
7+

README.md

+100
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
# generator-gulp-angular [![Build Status](https://secure.travis-ci.org/Swiip/generator-gulp-angular.png?branch=master)](https://travis-ci.org/Swiip/generator-gulp-angular)
2+
3+
> [Yeoman](http://yeoman.io) generator
4+
5+
Offers you a Yeoman generator to initiate a Web application with the following workflow:
6+
7+
<img height="100" align="left" src="https://raw.githubusercontent.com/yeoman/yeoman.io/master/app/assets/img/bullet-yo.gif">
8+
9+
<img height="100" align="left" src="http://bower.io/img/bower-logo.png">
10+
11+
<img height="100" align="left" src="https://s3.amazonaws.com/media-p.slid.es/uploads/hugojosefson/images/86267/angularjs-logo.png">
12+
13+
<img height="100" align="left" src="https://raw.github.com/gulpjs/artwork/master/gulp.png">
14+
15+
## Why generator-gulp-angular ?
16+
17+
This generator aims to takes the best from others generators like generator-angular, ngTailor and generator-gulp-webapp to offers the best workflow to start an application with AngularJS powered by Gulp!
18+
19+
generator-gulp-angular scaffolds out an Angularjs application with a full featured gulpfile.js wich offers all the tasks for a modern Web development.
20+
21+
## Getting Started
22+
23+
### What is Yeoman?
24+
25+
Trick question. It's not a thing. It's this guy:
26+
27+
![](http://i.imgur.com/JHaAlBJ.png)
28+
29+
Basically, he wears a top hat, lives in your computer, and waits for you to tell him what kind of application you wish to create.
30+
31+
Not every new computer comes with a Yeoman pre-installed. He lives in the [npm](https://npmjs.org) package repository. You only have to ask for him once, then he packs up and moves into your hard drive. *Make sure you clean up, he likes new and shiny things.*
32+
33+
```
34+
$ npm install -g yo
35+
```
36+
37+
### Yeoman Generators
38+
39+
Yeoman travels light. He didn't pack any generators when he moved in. You can think of a generator like a plug-in. You get to choose what type of application you wish to create, such as a Backbone application or even a Chrome extension.
40+
41+
To install generator-gulp-angular from npm, run:
42+
43+
```
44+
$ npm install -g generator-gulp-angular
45+
```
46+
47+
Finally, initiate the generator:
48+
49+
```
50+
$ yo gulp-angular
51+
```
52+
53+
### Getting To Know Yeoman
54+
55+
Yeoman has a heart of gold. He's a person with feelings and opinions, but he's very easy to work with. If you think he's too opinionated, he can be easily convinced.
56+
57+
If you'd like to get to know Yeoman better and meet some of his friends, [Grunt](http://gruntjs.com) and [Bower](http://bower.io), check out the complete [Getting Started Guide](https://github.com/yeoman/yeoman/wiki/Getting-Started).
58+
59+
## Directory structure
60+
61+
[Best Practice Recommendations for Angular App Structure](https://docs.google.com/document/d/1XXMvReO8-Awi1EZXAXS4PzDzdNvV6pGcuaF4Q9821Es/pub)
62+
63+
But I think keeping first division by file type: scripts, styles, partials.
64+
65+
## Features included in the gulpfile
66+
* useref
67+
* ngMin
68+
* uglify
69+
* cssmin
70+
* rev
71+
* watch
72+
* connect
73+
* jshint
74+
* **TODO** image optimization
75+
* **TODO** lazy
76+
* **TODO** browser sync
77+
* **TODO** Unit test
78+
* **TODO** e2e test
79+
80+
## Questions the generator will asks
81+
* **TODO** jQuery: jQuery, Zepto, none
82+
* **TODO** Angular modules: resources, animate...
83+
* **TODO** Angular UI modules: Bootstrap, Router, Utils...
84+
* **TODO** CSS Framework: Bootstrap with CSS, sass or less.
85+
* **TODO** CSS preprocessor: less, sass, none
86+
* **TODO** JS preprocessor: CoffeeScript, TypeScript, ECMAScript6 (Traceur)
87+
* **TODO** HTML preprocessor: Jade ?
88+
* **TODO** *Script loader: Require, Browserify, ES6 with Require ?*
89+
* **TODO** Test framework: Jasmine, Mocha, Qunit
90+
91+
## Changelog
92+
93+
### 0.0.1
94+
95+
* Initial commit
96+
* Scaffolds a working directory but with no options
97+
98+
## License
99+
100+
MIT

app/index.js

+101
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
'use strict';
2+
3+
var util = require('util');
4+
var path = require('path');
5+
var yeoman = require('yeoman-generator');
6+
var chalk = require('chalk');
7+
8+
var GulpAngularGenerator = yeoman.generators.Base.extend({
9+
init: function () {
10+
this.pkg = require('../package.json');
11+
12+
this.argument('appname', { type: String, required: false });
13+
this.appname = this.appname || path.basename(process.cwd());
14+
this.appname = this._.camelize(this._.slugify(this._.humanize(this.appname)));
15+
16+
this.on('end', function () {
17+
if (!this.options['skip-install']) {
18+
this.installDependencies();
19+
}
20+
});
21+
},
22+
23+
askFor: function () {
24+
//var done = this.async();
25+
26+
// have Yeoman greet the user
27+
this.log(this.yeoman);
28+
29+
// replace it with a short and sweet description of your generator
30+
this.log(chalk.magenta('You\'re using the fantastic GulpAngular generator.'));
31+
32+
/*var prompts = [{
33+
type: 'confirm',
34+
name: 'someOption',
35+
message: 'Would you like to enable this option?',
36+
default: true
37+
}];
38+
39+
this.prompt(prompts, function (props) {
40+
this.someOption = props.someOption;
41+
42+
done();
43+
}.bind(this));*/
44+
},
45+
46+
app: function () {
47+
var directories = [
48+
'app',
49+
'app/images',
50+
'app/partials',
51+
'app/scripts',
52+
'app/scripts/main',
53+
'app/styles'
54+
]
55+
56+
var copyFiles = [
57+
'app/favicon.ico',
58+
'app/404.html',
59+
'app/images/yeoman.png',
60+
'app/partials/main.html',
61+
'app/styles/main.scss'
62+
];
63+
64+
var templateFiles = [
65+
'package.json',
66+
'bower.json',
67+
'gulpfile.js',
68+
'app/index.html',
69+
'app/scripts/main/main-ctrl.js'
70+
];
71+
72+
var configFiles = [
73+
'gitignore',
74+
'editorconfig',
75+
'jshintrc',
76+
'bowerrc'
77+
];
78+
79+
directories.forEach(function(directory) {
80+
this.mkdir(directory);
81+
}.bind(this));
82+
83+
copyFiles.forEach(function(file) {
84+
this.copy(file, file);
85+
}.bind(this));
86+
87+
templateFiles.forEach(function(file) {
88+
var basename = path.basename(file);
89+
var source = file.replace(basename, '_' + basename);
90+
this.template(source, file);
91+
}.bind(this));
92+
93+
this.template('app/scripts/_appname.js', 'app/scripts/' + this.appname + '.js')
94+
95+
configFiles.forEach(function(file) {
96+
this.copy(file, '.' + file);
97+
}.bind(this));
98+
}
99+
});
100+
101+
module.exports = GulpAngularGenerator;

app/templates/_bower.json

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"name": "<%= appname %>",
3+
"version": "0.0.0",
4+
"dependencies": {
5+
"modernizr": "2.6.2",
6+
"angular": "1.2.x",
7+
"angular-route": "1.2.x",
8+
"bootstrap-sass-official": "3.1.1"
9+
},
10+
"devDependencies": {},
11+
"resolutions": {
12+
"angular": "1.2.x"
13+
}
14+
}

app/templates/_gulpfile.js

+128
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
'use strict';
2+
3+
var gulp = require('gulp');
4+
5+
// load plugins
6+
var $ = require('gulp-load-plugins')();
7+
8+
gulp.task('styles', function () {
9+
return gulp.src('app/styles/main.scss')
10+
.pipe($.rubySass({ style: 'expanded' }))
11+
.pipe($.autoprefixer('last 1 version'))
12+
.pipe(gulp.dest('.tmp/styles'))
13+
.pipe($.size());
14+
});
15+
16+
gulp.task('scripts', function () {
17+
return gulp.src('app/scripts/**/*.js')
18+
.pipe($.jshint())
19+
.pipe($.jshint.reporter($.jshintStylish))
20+
.pipe($.size());
21+
});
22+
23+
gulp.task('html', ['styles', 'scripts'], function () {
24+
var jsFilter = $.filter('**/*.js');
25+
var cssFilter = $.filter('**/*.css');
26+
27+
return gulp.src('app/*.html')
28+
.pipe($.useref.assets())
29+
.pipe($.rev())
30+
.pipe(jsFilter)
31+
.pipe($.ngmin())
32+
.pipe($.uglify())
33+
.pipe(jsFilter.restore())
34+
.pipe(cssFilter)
35+
.pipe($.csso())
36+
.pipe(cssFilter.restore())
37+
.pipe($.useref.restore())
38+
.pipe($.useref())
39+
.pipe($.revReplace())
40+
.pipe(gulp.dest('dist'))
41+
.pipe($.size());
42+
});
43+
44+
gulp.task('images', function () {
45+
return gulp.src('app/images/**/*')
46+
.pipe($.cache($.imagemin({
47+
optimizationLevel: 3,
48+
progressive: true,
49+
interlaced: true
50+
})))
51+
.pipe(gulp.dest('dist/images'))
52+
.pipe($.size());
53+
});
54+
55+
gulp.task('fonts', function () {
56+
return $.bowerFiles()
57+
.pipe($.filter('**/*.{eot,svg,ttf,woff}'))
58+
.pipe($.flatten())
59+
.pipe(gulp.dest('dist/fonts'))
60+
.pipe($.size());
61+
});
62+
63+
gulp.task('clean', function () {
64+
return gulp.src(['.tmp', 'dist'], { read: false }).pipe($.clean());
65+
});
66+
67+
gulp.task('build', ['html', 'images', 'fonts']);
68+
69+
gulp.task('default', ['clean'], function () {
70+
gulp.start('build');
71+
});
72+
73+
gulp.task('connect', function () {
74+
var connect = require('connect');
75+
var app = connect()
76+
.use(require('connect-livereload')({ port: 35729 }))
77+
.use(connect.static('app'))
78+
.use(connect.static('.tmp'))
79+
.use(connect.directory('app'));
80+
81+
require('http').createServer(app)
82+
.listen(9000)
83+
.on('listening', function () {
84+
console.log('Started connect web server on http://localhost:9000');
85+
});
86+
});
87+
88+
gulp.task('serve', ['connect', 'styles'], function () {
89+
require('opn')('http://localhost:9000');
90+
});
91+
92+
// inject bower components
93+
gulp.task('wiredep', function () {
94+
var wiredep = require('wiredep').stream;
95+
96+
gulp.src('app/styles/*.scss')
97+
.pipe(wiredep({
98+
directory: 'app/bower_components'
99+
}))
100+
.pipe(gulp.dest('app/styles'));
101+
102+
gulp.src('app/*.html')
103+
.pipe(wiredep({
104+
directory: 'app/bower_components',
105+
exclude: ['bootstrap-sass-official']
106+
}))
107+
.pipe(gulp.dest('app'));
108+
});
109+
110+
gulp.task('watch', ['connect', 'serve'], function () {
111+
var server = $.livereload();
112+
113+
// watch for changes
114+
115+
gulp.watch([
116+
'app/*.html',
117+
'.tmp/styles/**/*.css',
118+
'app/scripts/**/*.js',
119+
'app/images/**/*'
120+
]).on('change', function (file) {
121+
server.changed(file.path);
122+
});
123+
124+
gulp.watch('app/styles/**/*.scss', ['styles']);
125+
gulp.watch('app/scripts/**/*.js', ['scripts']);
126+
gulp.watch('app/images/**/*', ['images']);
127+
gulp.watch('bower.json', ['wiredep']);
128+
});

0 commit comments

Comments
 (0)