Created
May 5, 2014 11:42
-
-
Save sunew/6e3e4a446a7ac48ae2e0 to your computer and use it in GitHub Desktop.
generator-angular analyse af gruntfile
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
### generator-angular - grunt | |
Hvilke actions er mulige? | |
`grunt -h`: | |
Et uddrag: | |
` bowerInstall Inject all components in your HTML file. * | |
clean Clean files and folders. * | |
compass Compile Sass to CSS using Compass * | |
concat Concatenate files. * | |
connect Start a connect web server. * | |
copy Copy files. * | |
watch Run predefined tasks whenever watched files change. | |
serve Custom task. | |
build Alias for "clean:dist", "bowerInstall", "useminPrepare", | |
"concurrent:dist", "autoprefixer", "concat", "ngmin", | |
"copy:dist", "cdnify", "cssmin", "uglify", "rev", "usemin", | |
"htmlmin" tasks. | |
default Alias for "newer:jshint", "test", "build" tasks. | |
` | |
### flow | |
#### grunt serve | |
Arbejder uden dist. | |
- clean (fjerner .tmp) | |
- bowerInstall: der er indsat bower:css, bower:js, bower:scss tags forskellige steder: index.html og styles/main.scss. Dette processeres af bowerInstall. | |
Hvad gør ignorePath? Den fjerner en sti eller dele af en sti fra det der bliver sat ind. Se http://stackoverflow.com/questions/20912260/can-i-change-what-path-gets-rendered-when-using-bower-in-an-yeoman-angular-app og https://github.com/taptapship/wiredep | |
- concurrent:server -> compass:server. sass compilation -> tmp. Hvordan loades så css-filerne i tmp? (via livereload) | |
- autoprefixer (arbejder på css i .tmp) (sætter browser css prefixes) | |
- connect:livereload starter en server, med bases: | |
livereload: { | |
options: { | |
open: true, | |
base: [ | |
'.tmp', | |
'<%= yeoman.app %>' | |
] | |
} | |
livereload har to bases. | |
- til sidst: watch. | |
#### grunt build | |
- clean:dist (fjerne dist og .tmp) | |
- bowerInstall | |
- useminPrepare: samler konfig til andre tasks. | |
Her arbejdes med tags <!-- build:js scripts/vendor.js --> og <!-- build:css(.tmp) styles/main.css --> osv. | |
destination er dist. | |
der køres steps: js: ['concat', 'uglifyjs'], css: ['cssmin'] | |
Tilsidst logges hvad der vil blive gjort (i de næste steps). | |
- concurrent:dist -> compass:dist + imagemin, svgmin (-> .tmp) | |
- autoprefixer | |
- concat (arbejder på usemin config) (dest stadig .tmp) | |
- ngmin (angular safe for minification) | |
- copy:dist - kopierer html, images, fonts til dist. Se http://gruntjs.com/configuring-tasks#globbing-patterns | |
- cdnify - ændrer brug af lokale resourcer til hentning via cdn | |
- cssmin (dest = dist) | |
- uglify (virker den? useminPrepare bruger uglifyjs) (dest = dist) | |
- rev (renames generated files - browser caching) (arbejder på dist - alle typer resourcer: scripts, styles, images, fonts) | |
- usemin: rewrites to the new names from rev. | |
- htmlmin : komprimerer html'er (fjerne whitespace osv.) | |
Start webserver: | |
grunt connect:dist:keepalive | |
dist/images/generated: refereres til fra stylesheetet. | |
### Testing: generator-angular and karma | |
Karma is missing in package.json - noget med den underliggende generator-karma. | |
Fix: | |
`npm install grunt-karma --save-dev` | |
`npm install karma-jasmine --save-dev` | |
`npm install karma-chrome-launcher --save-dev` | |
Se iøvrigt http://www.yearofmoo.com/2013/01/full-spectrum-testing-with-angularjs-and-karma.html | |
karma-ng-scenario - nu anbefales protractor isf. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment