Question

我用grunt-injector完成了我的研究。但是，我还没有找到任何简单的解释通过grunt-injector将一些文件注入另一个文件的过程。

我的index.html标题：

<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<title>SmartHome</title>
<meta name="description" content=""/>
<meta name="author" content=""/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

<!-- build:css(client) styles/global.css -->
  <!-- bower:css -->
  <link rel="stylesheet" href="/bower_components/normalize.css/normalize.css" />
  <link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.css" />
  <link rel="stylesheet" href="/bower_components/nouislider/distribute/nouislider.min.css" />
  <!-- endbower -->
<!-- endbuild -->

每次我运行grunt服务时，都会删除

<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.css" />

我不知道为什么。我的bower.json包含bootstrap~3.3.4作为依赖项。我已经尝试过使用bower install --dev等多种方法......但是没有运气可以恢复此链接。

所以我认为我的最后一招是使用grunt-injector功能。任何人都可以给我一个所需语法的提示吗？我的文件结构：

/client/
---bower_components/
    (somemore folders)
    ---bootstrap.css
index.html

Answer 1

对于此任务，您可以使用：https://github.com/taptapship/wiredep

示例：

wiredep: {

                  task: {

                    // Point to the files that should be updated when
                    // you run `grunt wiredep`
                    src: [
                      'src/main/resources/view.html'
                    ],

                    options: {
                      // See wiredep's configuration documentation for the options
                      // you may pass:

                      // https://github.com/taptapship/wiredep#configuration
                    }
                  }
            }

Answer 2

injector: {
    options: {
        // Task-specific options go here. 
    },
    bower_dependencies: {
        files: {
            'index.html': ['bower.json'],
        }
    }
}

grunt-injector：将bootstrap bower组件注入index.html

2 个答案: