当 javascript 文件 src 路径以“/”开头时,我在使用 Gruntfile.js 时遇到问题。
我遵循这个用例http://briantford.com/blog/angular-yeoman.html
默认情况下,JS 文件包含为
<!-- build:js scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>
<!-- endbuild -->
$ ls dist/scripts/
ab541b7e.app.js afa864c8.scripts.js controllers vendor
$ cat dist/scripts/afa864c8.scripts.js
"use strict";var ...
....
App Engine 应用程序配置需要使用“/”前缀。
<!-- build:js scripts/scripts.js -->
<script src="/scripts/app.js"></script>
<script src="/scripts/controllers/main.js"></script>
<!-- endbuild -->
Build results in the concatenated file,
$ ls dist/scripts/
9eecb7db.scripts.js ab541b7e.app.js controllers vendor
$ cat dist/scripts/9eecb7db.scripts.js
但是,那么连接的脚本文件是空的。
完整的 Gruntfile 如下,未修改。
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/components'
},
// Coffee to JS compilation
coffee: {
compile: {
files: {
'app/scripts/*.js': 'app/scripts/**/*.coffee',
'test/spec/*.js': 'test/spec/**/*.coffee'
}
}
},
// compile .scss/.sass to .css using Compass
compass: {
dist: {
// http://compass-style.org/help/tutorials/configuration-reference/#configuration-properties
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: ''
},
// default watch configuration
watch: {
coffee: {
files: 'app/scripts/**/*.coffee',
tasks: 'coffee reload'
},
compass: {
files: [
'app/styles/**/*.{scss,sass}'
],
tasks: 'compass reload'
},
reload: {
files: [
'app/*.html',
'app/styles/**/*.css',
'app/scripts/**/*.js',
'app/views/**/*.html',
'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: {
angular: 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
}
});
// Alias the `test` task to run `testacular` instead
grunt.registerTask('test', 'run the testacular test driver', function () {
var done = this.async();
require('child_process').exec('testacular start --single-run', function (err, stdout) {
grunt.log.write(stdout);
done(err);
});
});
};
编辑:
做一些研究会导致下面的 repo,yeoman 用它来替换标记。 https://github.com/yeoman/grunt-usemin
仍然需要弄清楚,添加前导“/”有什么问题