gruntjs - Grunt usemin 与模板

标签 gruntjs yeoman

给定以下目录结构:

– Gruntfile.js
– app
    |– index.php
    |– js
    |– css
    |– templates
         |– template.php
– dist

如何配置 grunt usemin 以更新模板文件中相对于使用模板的 index.php 的样式和脚本的引用?

目前的任务是这样的:
useminPrepare: {
    html: '<%= yeoman.app %>/templates/template.php',
    options: {
        dest: '<%= yeoman.dist %>'
    }
},
usemin: {
    html: ['<%= yeoman.dist %>/{,*/}*.php'],
    css: ['<%= yeoman.dist %>/css/*.css'],
    options: {
        dirs: ['<%= yeoman.dist %>']
    }
}

模板内部的块看起来像这样:
<!-- build:js js/main.js -->
    <script src="js/script1.js"></script>
    <script src="js/script2.js"></script>
<!-- endbuild -->

最佳答案

好吧,我发现了:
解决方案是使用备用搜索路径选项:

<!-- build:<type>(alternate search path) <path> -->
... HTML Markup, list of script / link tags.
<!-- endbuild -->

构建块现在看起来像这样:
<!-- build:js(app) js/main.js -->
    <script src="js/script1.js"></script>
    <script src="js/script2.js"></script>
<!-- endbuild -->

并且 usemin 任务配置如下:
usemin: {
    html: '<%= yeoman.dist %>/templates/template.php',
    css: ['<%= yeoman.dist %>/css/*.css'],
    options: {
        dirs: ['<%= yeoman.dist %>']
    }
}

关于gruntjs - Grunt usemin 与模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15746952/

相关文章:

javascript - grunt 创建并运行 less 编译任务

javascript - Yeoman (bower,grunt) - 'SockJS' 未定义

node.js - 服务器端包括 (SSI) 与 grunt 连接网络服务器

javascript - Grunt 构建破坏了 SVG 图像

javascript - Grunt concat 输出为空

css - SASS 的 grunt-task 允许选项来强制执行代码样式

express - 在 Express.js 项目中使用 Yeoman/Brunch/Grunt

node.js - 更新到 Grunt 导致 "Use of const in strict mode"错误

html - 咕噜服务 :dist using local file paths

gruntjs - 如何使用 yeoman 生成器将多个文件作为模板处理?