I want to run ng-annotate via grunt on all my project's angular files.
Could not find this option.
I only have the option annotate by specify file name.
ngAnnotate: {
dist: {
files: {
'output_file_name.js': ['input_file_name'],
},
}
}
I need something more generic that would run recursively on a specific directory.
You can use the other configuration to go through folders and annotate each file which will be outputted in a *.annotated.js file.
ngAnnotate: {
dist: {
files: [{
expand: true,
src: ['**/*.js', '!**/*.annotated.js'],
ext: '.annotated.js',
extDot: 'last'
}],
}
}
Related
I'm new in using Grunt tool, I was doing the steps like the video said, but i faced some errors and started from the whole beginning again, but now i'm facing this issue, when i type the command "grunt" in the CMD in the directory of the project folder i get everything good, but there is no JavaScript file created in the distribution folder directory "dist/scripts", and even the Uglify is not generated.
In the video after the instructor typed the command grunt a JS file created in dist/scripts directory with name "main.6c5adb2140e008f7bb85.js", and css file created in dist/styles directory with name "main.d1901e133950f2e3aeae.css", and also in his terminal it was written replaced 1 reference to assets and Uglify generated like in the picture:
Instead i get replaced 0 references to assets and the uglify is not generated:
I did all the installation command that in the video by order, and i created all the files (package.json, Gruntfile.js, app.js, .jshintrc)
after that i added the usemin to the require jit-grunt
and added it to the registerTask. Here's the Gruntfile.js source code:
'use strict';
module.exports = function (grunt) {
// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);
// Automatically load required Grunt tasks
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin'
});
// Define the configuration for all the tasks
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
// Make sure code styles are up to par and there are no obvious mistakes
jshint: {
options: {
jshintrc: '.jshintrc',
reporter: require('jshint-stylish')
},
all: {
src: [
'Gruntfile.js',
'app/scripts/{,*/}*.js'
]
}
},
useminPrepare: {
html: 'app/menu.html',
options: {
dest: 'dist'
}
},
// Concat
concat: {
options: {
separator: ';'
},
// dist configuration is provided by useminPrepare
dist: {}
},
// Uglify
uglify: {
// dist configuration is provided by useminPrepare
dist: {}
},
cssmin: {
dist: {}
},
// Filerev
filerev:{
options: {
encoding: 'utf8',
algorithm: 'md5',
length: 20
},
release: {
// filerev: release hashes(md5) all assets (images, js and css)
// in dist directory
files: [{
src: [
'dist/scripts/*.js',
'dist/styles/*.css',
]
}]
}
},
// Usemin
// Replace all assets with their revved version in html and css files.
// options.assetDirs contains the directories for finding the assets
// according to their relative paths
usemin: {
html: ['dist/*.html'],
css: ['dist/styles/*.css'],
options: {
assetsDirs: ['dist', 'dist/styles']
}
},
copy: {
dist: {
cwd: 'app',
src: [ '**','!styles/**/*.css','!scripts/**/*.js' ],
dest: 'dist',
expand: true
},
fonts: {
files: [
{
//for bootstrap fonts
expand: true,
dot: true,
cwd: 'bower_components/bootstrap/dist',
src: ['fonts/*.*'],
dest: 'dist'
}, {
//for font-awesome
expand: true,
dot: true,
cwd: 'bower_components/font-awesome',
src: ['fonts/*.*'],
dest: 'dist'
}
]
}
},
clean: {
build: {
src: [ 'dist/']
}
}
});
grunt.registerTask('build', [
'clean',
'jshint',
'useminPrepare',
'concat',
'cssmin',
'uglify',
'copy',
'filerev',
'usemin'
]);
grunt.registerTask('default',['build']);
};
Need help please !!
it's look like there is no mistake in the commands that 've wrote but the mistake here is the name of the html in my project folder is not the same name which is "menu.html" and i wrote it in Gruntfile "meun.html" that's why it doesn't create the js & css file !!
Hello I'm trying to create a documentation for my ionicframework/angularjs application via grunt and ngdoc.
I've installed everything like preferred in http://gruntjs.com/getting-started
Well if I now run grunt
I get:
Running "jshint:gruntfile" (jshint) task
>> 1 file lint free.
Running "jshint:lib_test" (jshint) task
>> 0 files linted. Please check your ignored files.
Running "qunit:files" (qunit) task
Warning: 0/0 assertions ran (0ms) Use --force to continue.
Aborted due to warnings.
And with that I can't show the docs.
My gruntfile is looking like this:
/*global module:false*/
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
// Task configuration.
jshint: {
options: {
curly: true,
eqeqeq: true,
immed: true,
latedef: true,
newcap: true,
noarg: true,
sub: true,
undef: true,
unused: true,
boss: true,
eqnull: true,
browser: true,
globals: {
jQuery: true
}
},
gruntfile: {
src: 'Gruntfile.js'
},
lib_test: {
src: ['lib/**/*.js', 'test/**/*.js']
}
},
qunit: {
files: ['test/**/*.html']
},
ngdocs: {
all: ['src/resources/js/*.js']
},
watch: {
gruntfile: {
files: '<%= jshint.gruntfile.src %>',
tasks: ['jshint:gruntfile']
},
lib_test: {
files: '<%= jshint.lib_test.src %>',
tasks: ['jshint:lib_test', 'qunit']
}
}
});
// These plugins provide necessary tasks.
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-ngdocs');
// Default task.
grunt.registerTask('default', ['jshint', 'qunit']);
grunt.registerTask('build','Build the application',['ngdocs']);
};
I'm new in creating docs for angularjs so what is the best practice for that purpose?
When you just use 'grunt' from the command line, it will attempt to run every task in the Gruntfile.js.
You want to just run ngdocs, so you should use grunt ngdocs as the command line command.
You've also added a task called 'build', which just runs ngdocs, so you can also use: grunt build
I'm trying to use grunt-ng-annotate in my build, and my files don't seem to be annotated when I view them.
ngAnnotate: {
options: {
singleQuotes: true
},
dist: {
files: [{
expand: true,
cwd: '.tmp/concat/scripts',
src: '*.js',
dest: '.tmp/concat/scripts'
}]
}
},
However, if I add:
ext: '.annotated.js',
Then I can see the annotation in the file. It appears that somehow, it just doesn't want to overwrite the old files, unless I name them something different. What's the deal here?
I encountered this problem today as well. I decided to post solution for myself, because I really struggled with this and thought maybe someone else may need this at some point. So what I had to do was set remove and add options for ngAnnotate, so it can remove and add annotated items like this:
ngAnnotate: {
options: {
remove: true,
add: true
},
dist: {
files: [{
expand: true,
sourceMap: true,
src: 'src/js/**/*.js',
}],
}
},
Is it possible with the grunt-contrib-copy plugin or any other copy plugin to copy only files?
I am currently using the following task:
copy: {
vendorJs: {
files: [
{
dest: "app/dist/client/vendor/js/",
src: ["bower_components/**/*.min.js"]
}
]
}
}
So how can i copy only files in my destination without taking the folder structure of the src object in consideration?
Thanks in advance!
After some research I found out that the grunt file pattern serves a "flatten" attribute which can be used to achieve the task above.
Following configuration solved my problem:
copy: {
vendorJs: {
files: [
{
expand: true,
flatten: true,
filter: "isFile",
cwd: "bower_components/",
dest: "app/dist/client/vendor/js/",
src: ["**/*.min.js"]
}
]
}
I am having a backbone project in yeoman and below is my grunt file configuration
module.exports = function( grunt ) {
'use strict';
//
// Grunt configuration:
//
// https://github.com/cowboy/grunt/blob/master/docs/getting_started.md
//
grunt.initConfig({
// Project configuration
// ---------------------
// specify an alternate install location for Bower
bower: {
dir: 'app/scripts/vendor'
},
// Coffee to JS compilation
coffee: {
dist: {
src: 'app/scripts/**/*.coffee',
dest: 'app/scripts'
}
},
// compile .scss/.sass to .css using Compass
compass: {
dist: {
// http://compass-style.org/help/tutorials/configuration-reference/#configuration-properties
require: ['susy'],
options: {
css_dir: 'temp/styles',
sass_dir: 'app/styles',
images_dir: 'app/images',
javascripts_dir: 'temp/scripts',
force: true
}
}
},
// generate application cache manifest
manifest:{
dest: ''
},
// headless testing through PhantomJS
mocha: {
all: ['test/**/*.html']
},
// default watch configuration
watch: {
coffee: {
files: '<config:coffee.dist.src>',
tasks: 'coffee reload'
},
compass: {
files: [
'app/styles/**/*.{scss,sass}'
],
tasks: 'compass reload'
},
reload: {
files: [
'app/*.html',
'app/styles/**/*.css',
'app/scripts/**/*.js',
'app/images/**/*'
],
tasks: 'reload'
}
},
// default lint configuration, change this to match your setup:
// https://github.com/cowboy/grunt/blob/master/docs/task_lint.md#lint-built-in-task
lint: {
files: [
'Gruntfile.js',
'app/scripts/**/*.js',
'spec/**/*.js'
]
},
// specifying JSHint options and globals
// https://github.com/cowboy/grunt/blob/master/docs/task_lint.md#specifying-jshint-options-and-globals
jshint: {
options: {
curly: true,
eqeqeq: true,
immed: true,
latedef: true,
newcap: true,
noarg: true,
sub: true,
undef: true,
boss: true,
eqnull: true,
browser: true
},
globals: {
jQuery: true
}
},
// Build configuration
// -------------------
// the staging directory used during the process
staging: 'temp',
// final build output
output: 'dist',
mkdirs: {
staging: 'app/'
},
// Below, all paths are relative to the staging directory, which is a copy
// of the app/ directory. Any .gitignore, .ignore and .buildignore file
// that might appear in the app/ tree are used to ignore these values
// during the copy process.
// concat css/**/*.css files, inline #import, output a single minified css
css: {
'styles/main.css': ['styles/**/*.css']
},
// renames JS/CSS to prepend a hash of their contents for easier
// versioning
rev: {
js: 'scripts/**/*.js',
css: 'styles/**/*.css',
img: 'images/**'
},
// usemin handler should point to the file containing
// the usemin blocks to be parsed
'usemin-handler': {
html: 'index.html'
},
// update references in HTML/CSS to revved files
usemin: {
html: ['**/*.html'],
css: ['**/*.css']
},
// HTML minification
html: {
files: ['**/*.html']
},
// Optimizes JPGs and PNGs (with jpegtran & optipng)
img: {
dist: '<config:rev.img>'
},
// rjs configuration. You don't necessarily need to specify the typical
// `path` configuration, the rjs task will parse these values from your
// main module, using http://requirejs.org/docs/optimization.html#mainConfigFile
//
// name / out / mainConfig file should be used. You can let it blank if
// you're using usemin-handler to parse rjs config from markup (default
// setup)
rjs: {
// no minification, is done by the min task
optimize: 'none',
baseUrl: './scripts',
wrap: true,
name:'config',
}//,
// While Yeoman handles concat/min when using
// usemin blocks, you can still use them manually
//concat: {
//dist: ''
//},
//min: {
// dist: ''
// }
});
// Alias the `test` task to run the `mocha` task instead
grunt.registerTask('test', 'mocha');
};
I have tried to build this , even though build was a success i am not getting the bacbone models and views on the minified app-amd.js file
Can i get any pointers on this?
Try using the latest backbone generator with Yeoman 1.0beta. We have made lots of improvements to it.
If you are still facing the same issue, please raise a ticket on github.