我已经阅读了所有关于grunt-preprocess的文档和所有SO帖子,但仍然无法使其工作。它似乎是一个非常有用的选项,非常感谢帮助实现这一点。
我的Gruntfile.js中有以下内容
env: {
dev: {
NODE_ENV: 'DEVELOPMENT',
},
dist: {
NODE_ENV: 'PRODUCTION',
},
},
preprocess: {
dev: {
options: {
context: {
NODE_ENV: 'DEVELOPMENT'
},
},
files: {
'app/wp-content/themes/nuvo/footer.php' : 'app/wp-content/themes/nuvo/footer-template.php'
},
},
dist: {
options: {
context: {
NODE_ENV: 'PRODUCTION'
},
},
files: {
'dist/wp-content/themes/nuvo/footer.php' : 'app/wp-content/themes/nuvo/footer-template.php'
},
},
},
其次是:
grunt.registerTask('default', [
'clean:dist',
'env:dev',
'preprocess:dev',
'browser_sync',
'watch',
'jshint'
]);
我的footer-template.php文件包含以下内容:
<!-- @if NODE_ENV == 'DEVELOPMENT' --><!-- @endif -->
<!-- @if NODE_ENV == 'PRODUCTION' -->
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-*******-*']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- @endif -->
当我运行默认的grunt任务时,会生成footer.php文件,但没有任何预处理,它看起来与footer-template.php文件完全相同。对此有任何帮助非常感谢!
这是我在运行grunt时得到的--verbose:
Running "env:dev" (env) task
Verifying property env.dev exists in config...OK
File: [no files]
Options: (none)
Running "preprocess:dev" (preprocess) task
Verifying property preprocess.dev exists in config...OK
Files: app/wp-content/themes/nuvo/footer-template.php -> app/wp-content/themes/nuvo/footer.php
Verifying property preprocess exists in config...OK
Options: context={"NODE_ENV":"DEVELOPMENT"}
Reading app/wp-content/themes/nuvo/footer-template.php...OK
Writing app/wp-content/themes/nuvo/footer.php...OK
答案 0 :(得分:1)
好的,所以作为一个冰雹玛丽解决方案我将页脚模板文件从.php文件更改为.html文件(仍然输出到.php文件)并且它有效。我猜grunt-preprocess只解析.html文件。
这是我的预处理grunt任务:
preprocess: {
dev: {
options: {
context: {
NODE_ENV: 'DEVELOPMENT'
},
},
files: {
'app/wp-content/themes/nuvo/footer.php' : 'app/wp-content/themes/nuvo/footer-template.html'
},
},
dist: {
options: {
context: {
NODE_ENV: 'PRODUCTION'
},
},
files: {
'dist/wp-content/themes/nuvo/footer.php' : 'app/wp-content/themes/nuvo/footer-template.php'
},
},
},
这是.html模板文件中的代码块:
<!-- @if NODE_ENV == 'DEVELOPMENT' --><!-- @endif -->
<!-- @if NODE_ENV == 'PRODUCTION' -->
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-*******-*']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- @endif -->
我不再需要grunt-env模块,它只与grunt-preprocess模块一起使用。希望这能为将来节省一些时间!