Reputation: 6689
I have a problem with grunt-usemin
plugin.
Basically, I want to put all my static content in static/
directory under app
or dist
(depends if the application is built or not).
Now, here is my grunt config
useminPrepare: {
html: ['<%= yeoman.app %>/app.html', '<%= yeoman.app %>/login.html'],
options: {
dest: '<%= yeoman.dist %>/static'
}
},
usemin: {
html: ['<%= yeoman.dist %>/{,*/}*.html'],
css: ['<%= yeoman.dist %>/static/styles/**/*.css'],
options: {
dirs: ['dist/static/']
}
}
the first part goes ok watching on the output
Found a block:
<!-- build:css(.tmp) login/styles/main.css -->
<link rel="stylesheet" href="styles/bootstrap.css">
<link rel="stylesheet" href="styles/main.css">
<!-- endbuild -->
Updating config with the following assets:
- .tmp/styles/bootstrap.css
- .tmp/styles/main.css
Found a block:
<!-- build:js({app/static}) login/scripts/libs.js -->
<script src="bower_components/angular/angular.js"></script>
<!-- endbuild -->
Updating config with the following assets:
- {app/static}/bower_components/angular/angular.js
Found a block:
<!-- build:js({.tmp,app/static}) login/scripts/scripts.js -->
<script src="scripts/loginApp.js"></script>
<script src="scripts/controllers/login.js"></script>
<!-- endbuild -->
Updating config with the following assets:
- {.tmp,app/static}/scripts/loginApp.js
- {.tmp,app/static}/scripts/controllers/login.js
Configuration is now:
cssmin:
{ 'dist/static/login/styles/main.css': 'dist/static/login/styles/main.css' }
concat:
{ 'dist/static/login/styles/main.css':
[ '.tmp/styles/bootstrap.css',
'.tmp/styles/main.css' ],
'dist/static/login/scripts/libs.js': [ '{app/static}/bower_components/angular/angular.js' ],
'dist/static/login/scripts/scripts.js':
[ '{.tmp,app/static}/scripts/loginApp.js',
'{.tmp,app/static}/scripts/controllers/login.js' ] }
uglify:
{ 'dist/static/login/scripts/libs.js': 'dist/static/login/scripts/libs.js',
'dist/static/login/scripts/scripts.js': 'dist/static/login/scripts/scripts.js' }
requirejs:
{}
but the problem is with swapping normal files with their revved versions, for example, here is html before usemining:
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Login</title>
<meta name="viewport" content="width=device-width">
<!-- build:css(.tmp) login/styles/main.css -->
<link rel="stylesheet" href="styles/bootstrap.css">
<link rel="stylesheet" href="styles/main.css">
<!-- endbuild -->
</head>
<body ng-app="jsLinkedinConnectorLoginApp">
<div class="container" ng-view=""></div>
<!-- build:js({app/static}) login/scripts/libs.js -->
<script src="bower_components/angular/angular.js"></script>
<!-- endbuild -->
<!-- build:js({.tmp,app/static}) login/scripts/scripts.js -->
<script src="scripts/loginApp.js"></script>
<script src="scripts/controllers/login.js"></script>
<!-- endbuild -->
</body>
</html>
and after:
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Login</title>
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="login/styles/main.css">
</head>
<body ng-app="jsLinkedinConnectorLoginApp">
<div class="container" ng-view=""></div>
<script src="login/scripts/libs.js"></script>
<script src="login/scripts/scripts.js"></script>
</body>
</html>
so it is almost right, it seems that grunt does not pick up revved files in dist/static
directory.
Now when I move for example dist/static/login
directory up, to the dist/login
and change dirs
to dist
everything works fine, so giving subdirectory to dist
seems to cause problems.
Upvotes: 3
Views: 1751
Reputation: 6689
I solved my issue by updating grunt-usemin
plugin to 2.0.0
version and switching dirs
property to assetsDirs
.
Upvotes: 2