How to match every folder but one in grunt? - gruntjs

I'm using grunt to copy files from source folder to dest folder. for this specific, I'm copying everything inside the main-folder, but I don't want "folder-X" and "folder-Z" copied with the rest of the folders that are inside the main-folder.
In my Grunt:
copy: {
dist: {
files: [{
expand: true,
cwd:'<%= app %>/',
src: ['main-folder/**', '!**/*.scss'],
dest: '<%= dist %>/'
}]
},
},

Can not not just adjust your src directory list as you have done within it for the scss so:
copy: {
dist: {
files: [{
expand: true,
cwd:'<%= app %>/',
src: ['main-folder/**', '!**/*.scss', '!main-folder/folder-X/**', '!main-folder/folder-Y/**'],
dest: '<%= dist %>/'
}]
},
},

Related

Grunt | Compile subfolders + including pug files

In this current situation grunt does watch the files in subfolder but there is no compilation to dist.
See (part) of my gruntfile:
grunt.initConfig({
pkg: grunt.file.readJSON('./package.json'),
config: {
dist: './dist',
src: './src',
htmlPath: '<%= config.dist %>'
},
watch: {
options: {
spawn: false
},
pug: {
files: '<%= config.src %>/**/*.pug',
tasks: ['pug:dist']
}
},
pug: {
dist: {
options: {
pretty: true,
data: {
debug: false
}
},
files: [{
expand: true,
cwd: '<%= config.src %>',
src: ['*.pug'],
dest: '<%= config.dist %>',
ext: '.html',
}]
}
},
});
I am guessing this probally because of includes folders and such (that should appear in dist folder). How can I modify my setup so grunt does compile some specific subfolders and files within?

Yeoman Grunt HTMLMin copy all files in subdirectories to same folder structure in dist

Looking for the right regular expression(s) to mirror the folder structure from "app" to the "dist" folder.
E.g. app/components/search/a.html
app/components/search/b.html
etc.
To: dist/components/search/a.html
dist/components/search/b.html
etc.
My current grunt htmlmin entry:
htmlmin: {
dist: {
options: {
collapseWhitespace: true,
collapseBooleanAttributes: true,
removeCommentsFromCDATA: true,
removeOptionalTags: true
},
files: {
'<%= yeoman.dist %>/components/search' : '<%= yeoman.app %>/components/search/**/*.html'
}
}
},
Have tried several other combinations unsuccessfully.
Turns out there is a pretty decent template for doing this in the Grunt file that Yeoman generate for Angular.
The yeoman generator directory style isn't quite what I wanted, so the default doesn't work. I've amended it to fit my needs.
My solution:
htmlmin: {
dist: {
options: {
collapseWhitespace: true,
collapseBooleanAttributes: true,
removeCommentsFromCDATA: true,
removeOptionalTags: true
},
files: [
{
expand: true,
cwd: '<%= yeoman.app %>/components',
src: '{,*/}*.html',
dest: '<%= yeoman.dist %>/components'
}
]
}
}

How to omit a folder from the output file structure of a Grunt task

Im running a grunt task to build an Assemble site.
My task is configured as follows:
assemble: {
options: {
flatten: false,
assets: '<%= config.dist %>',
dist: '<%= config.dist %>',
layout: 'default.hbs',
layoutdir: 'templates/layouts/',
partials: 'templates/partials/*.hbs',
},
pages: {
files: { '<%= config.dist %>': ['pages/{,*/}*.hbs'] }
}
},
In my source files, I have a structure like this:
pages
cat1
cat2
This is outputting something like:
dist
pages
cat1
cat2
How can I setup the task so that it won't include the /pages folder but still generate the subfolders?
#jakerella is close but missing one piece, ext. It should be:
files: [
{
expand: true,
cwd: 'pages',
src: ['**/*.hbs'],
dest: '<%= config.dist %>/',
ext: '.html'
}
]
So you want it to be just dist->cat1 and dist->cat2? I think you'll need to tweak your pages target a bit, but I think you're looking for the expand and cwd options:
pages: {
files: {
expand: true,
cwd: 'pages/',
src: ['**/*.hbs'],
dest: '<%= config.dist %>',
ext: '.html'
}
}
(This was partially yanked from this answer.)
EDIT Added the ext option as well.

Grunt - Copy specific file without usemin

I would like to copy specific coffeescript file (which is not included in the <!-- build:js({.tmp, app}) --> section in my index.html) to for example dist/scripts directory.
I tried with (Gruntfile.js):
copy: {
dist: {
files: [
// ...
{
expand: true,
cwd: './tmp/scripts/polyfill',
dest: '<%= yeoman.dist %>/scripts/polyfill',
src: [
'*'
]
}]
}
},
If you just have one single file you want to copy over, you can use the simpler grunt syntax:
copy: {
dist: {
files: [{
'.tmp/scripts/polyfill/myfile.js': '<%= yeoman.dist %>/scripts/polyfill/myfile.js'
}]
}
}
Also the name of the temporary folder is .tmp, not just tmp.
This worked:
{
expand: true,
cwd: '.tmp/scripts/polyfill',
dest: '<%= yeoman.dist %>/scripts/polyfill',
src: [
'polyfill.js'
]
}
My approach was good, however it contained a typo: ./tmp - it should be .tmp.

Can I configure a grint-contrib-less task to compile into a parallel structure?

Currently we are using grunt-contrib-less to handle our LESS file compiling as a Grunt task. The less files are stored in a structure similar to this:
assets/
styles/
base.less
client/
client.less
device/
tablet.less
phone.less
We have the following for our Grunt config:
less: {
options: {
paths: 'assets/',
yuicompress: false,
ieCompat: true,
require: [
'assets/styles/base.less'
]
},
src: {
expand: true,
cwd: 'assets/',
src: [
'styles/**/*.less'
],
ext: '.css',
dest: 'assets/'
}
},
Currently this is installing all of the generated css files into the same directory as the original less file it came from. What we'd like to do is have them spit out into an /assets/css/ directory, but with the same relative structure. eg:
assets/
css/
base.css
client/
client.css
device/
tablet.css
phone.css
Is there a grunt-contrib-less configuration that can accomplish this?
An easier way to do this seems to be:
less: {
options: {
paths: 'assets/',
ieCompat: true,
require: [
'assets/styles/base.less'
]
},
src: {
expand: true,
cwd: 'assets/styles/',
src: [
'**/*.less'
],
ext: '.css',
dest: 'assets/css'
}
},
I was able to achieve the desired effect wit the following Gruntfile.js
var path = require('path');
module.exports = function(grunt) {
grunt.initConfig({
less: {
options: {
paths: 'assets/',
yuicompress: false,
ieCompat: true,
require: [
'assets/styles/base.less'
]
},
src: {
expand: true,
cwd: 'assets/',
src: [
'styles/**/*.less'
],
ext: '.css',
dest: 'assets',
rename: function(dest, src) {
return path.join(dest, src.replace(/^styles/, 'css'));
}
}
},
});
grunt.loadNpmTasks('grunt-contrib-less');
}
Explanation
Although it is not in the grunt-contrib-less docs there are a bunch more features available for files objects. I didn't realize there were this many until I was working on answering this question. The link for the docs on them is under resources.
Resources
Configuring tasks - Building the files object dynamically

Resources