So I have started yo angular for a new project and it's great, the only issue is that I like to structure my views and have partials etc, for example a great structure for me is something like the following:
app/views/_partials/modals
app/views/_partials/menus
app/views/_partials/buttons
app/views/index.html
app/views/about.html
However, it appears that the angular generator doesn't look in sub directories when building into the dist folder and I get all sorts of missing includes and errors.
Can I change Grunt to look into these sub directories and process the views accordingly so that they appear within my app after building?
I located an interesting block that I think could be responsible in my Grunt file:
ngtemplates: {
dist: {
options: {
module: 'myApp',
htmlmin: '<%= htmlmin.dist.options %>',
usemin: 'scripts/scripts.js'
},
cwd: '<%= yeoman.app %>',
src: 'views/{,*/}*.html',
dest: '.tmp/templateCache.js'
}
},
Or is it something in the usemin block? I'm confused (relatively new to Angular):
usemin: {
html: ['<%= yeoman.dist %>/{,*/}*.html'],
css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
js: ['<%= yeoman.dist %>/scripts/{,*/}*.js'],
options: {
assetsDirs: [
'<%= yeoman.dist %>',
'<%= yeoman.dist %>/images',
'<%= yeoman.dist %>/styles'
],
patterns: {
js: [[/(images\/[^''""]*\.(png|jpg|jpeg|gif|webp|svg))/g, 'Replacing references to images']]
}
}
},
Ok, so I figured this one out, the issue was in the ngtemplates block and my code now looks like this:
ngtemplates: {
dist: {
options: {
module: 'myApp',
htmlmin: '<%= htmlmin.dist.options %>',
usemin: 'scripts/scripts.js'
},
cwd: '<%= yeoman.app %>',
src: 'views/**/**/*.html',
dest: '.tmp/templateCache.js'
}
},
Notice the src attribute has changed from:
src: 'views/{,*/}*.html',
to:
src: 'views/**/**/*.html',
This seems to capture all my templates within the _partials directories