Question

我想使用GULP在head标签内部注入javascript库，在body上注入我的自定义和自己的代码。

例如：

<html>
    <head>
      <!-- injectJS -->
         <script src="jquery.js">
         <script src="d3.js">
      <!-- injected -->
    </head>

    <body>
      <!-- injectJS -->
         <script src="index.js">
      <!-- injected -->
    </body>
</html>

Answer 1

我一直在使用gulp-template来做到这一点。然后您的index.html必须进行调整。 e.g：

<% scripts.forEach( function ( file ) { %>
    <script type="text/javascript" src="<%= file %>" inline></script>
<% }); %>

在这个例子中，你的gulpfile任务看起来像是：

gulp.task('index', () =>
    gulp.src('src/index.html')
        .pipe(template({scripts: ['script.js', 'another-one.js']}))
        .pipe(gulp.dest('dist'))
    );

实现此目标的另一种方法是使用gulp-inject。我喜欢gulp-template。

如何使用gulp在标题和正文中注入javascript

1 个答案: