我正在使用AngularJS应用。我正在用Grunt构建这个应用程序。我有三个Grunt任务:开发,测试和发布。我想在每种情况下有条件地引用一些JavaScript文件。例如,我想做这样的事情:
的index.html
<!-- if task === 'dev' -->
<script type="text/javascript" src="/js/script.dev.js"></script>
<!-- else if task === 'test' -->
<script type="text/javascript" src="/js/script.test.js"></script>
<!-- else -->
<script type="text/javascript" src="/js/script.min.js"></script>
以上是psedocode。它是在构建时使用Grunt有条件地引用文件的想法。另外,我想在我的JavaScript中做类似的事情。我想做点什么:
#IF RELEASE
var app = angular.module('myApp', ['service', 'otherModule']);
#ELSE
var app = angular.module('myApp', ['serviceMocks', 'otherModule']);
#ENDIF
再次,上面是伪代码。我正在追求用Grunt预处理JavaScript的想法。非常感谢你!
答案 0 :(得分:0)
另一种选择是使用grunt-replace,只替换变量:
grunt.initConfig({
replace: {
dev: {
options: {
patterns: [{
json: {
"script_src": "/js/script.dev.js",
"service": "service"
}
}]
},
files: [{
expand: true,
src: ['index.html', 'your-file.js']
}]
},
test: {
options: {
patterns: [{
json: {
"script_src": "/js/script.test.js",
"service": "serviceMock"
}
}]
},
files: [{
expand: true,
src: ['index.html', 'your-file.js']
}]
},
prod: {
patterns: [{
json: {
"script_src": "/js/script.min.js",
"service": "service"
}
}],
files: [{
expand: true,
src: ['index.html', 'your-file.js']
}]
}
}
});
你的html / js文件中的只是准备变量,例如:
<script type="text/javascript" src="@@srcipt_src"></script>
或
var app = angular.module('myApp', ['@@service', 'otherModule']);
如果你的替换会变大,你可以把它放在一些特定于目标的json文件中:
// e.g. content of dev.json
{
"script_src": "/js/script.dev.js",
"service": "service"
}
并在你的dev-subtask中:
dev: {
options: {
patterns: [{
json: grunt.file.readJSON('dev.json')
}],
files: [{
expand: true,
src: ['index.html', 'your-file.js']
}]
}
}
如果特定于目标的配置变大,这将是有意义的。