useminprepare:html 意外的令牌

Question

我使用 Yeoman 生成了一个 Fresh Webapp，并且运行 Grunt Build --verbose。以下警告

Running "useminPrepare:html" (useminPrepare) task
Verifying property useminPrepare.html exists in config...OK
Files: app/index.html -> html
Options: dest="dist"
Going through app/index.html to update the config
Looking for build script HTML comment blocks
Warning: An error occurred while processing a template (Unexpected token )). Use --force to continue.

Aborted due to warnings.

这是我的 /Gruntfile.js

// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
  options: {
    dest: '<%= config.dist %>'
  },
  html: '<%= config.app %>/index.html'
},

// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
  options: {
    assetsDirs: [
      '<%= config.dist %>',
      '<%= config.dist %>/images',
      '<%= config.dist %>/styles'
    ]
  },
  html: ['<%= config.dist %>/{,*/}*.html'],
  css: ['<%= config.dist %>/styles/{,*/}*.css']
},

这里是 /app/index.html

<!doctype html>
<html class="no-js" lang="">
  <head>
    <meta charset="utf-8">
    <title>test1</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="shortcut icon" href="/favicon.ico">
    <link rel="apple-touch-icon" href="/apple-touch-icon.png">
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->

    <!-- build:css(.) styles/vendor.css -->
    <!-- bower:css -->
    <!-- endbower -->
    <!-- endbuild -->
    <!-- build:css(.tmp) styles/main.css -->
    <link rel="stylesheet" href="styles/main.css">
    <!-- endbuild -->
    <!-- build:js scripts/vendor/modernizr.js -->
    <script src="/bower_components/modernizr/modernizr.js"></script>
    <!-- endbuild -->

  </head>
  <body>
    <!--[if lt IE 10]>
      <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
    <![endif]-->


    <div class="container">
      <div class="header">
        <ul class="nav nav-pills pull-right">
          <li class="active"><a href="#">Home</a></li>
          <li><a href="#">About</a></li>
          <li><a href="#">Contact</a></li>
        </ul>
        <h3 class="text-muted">test1</h3>
      </div>

      <div class="jumbotron">
        <h1>'Allo, 'Allo!</h1>
        <p class="lead">Always a pleasure scaffolding your apps.</p>
        <p><a class="btn btn-lg btn-success" href="#">Splendid! <span class="glyphicon glyphicon-ok"></span></a></p>
      </div>

      <div class="row marketing">
        <div class="col-lg-6">
          <h4><a href="https://html5boilerplate.com/">HTML5 Boilerplate</a></h4>
          <p>HTML5 Boilerplate is a professional front-end template for building fast, robust, and adaptable web apps or sites.</p>

          <h4><a href="http://libsass.org/">Sass</a></h4>
          <p>Sass is a mature, stable, and powerful professional grade CSS extension language.</p>


          <h4><a href="http://getbootstrap.com/">Bootstrap</a></h4>
          <p>Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.</p>

          <h4><a href="http://modernizr.com/">Modernizr</a></h4>
          <p>Modernizr is an open-source JavaScript library that helps you build the next generation of HTML5 and CSS3-powered websites.</p>

        </div>
      </div>

      <div class="footer">
        <p><span class="glyphicon glyphicon-heart"></span> from the Yeoman team</p>
      </div>
    </div>


    <!-- build:js(.) scripts/vendor.js -->
    <!-- bower:js -->
    <script src="/bower_components/jquery/dist/jquery.js"></script>
    <!-- endbower -->
    <!-- endbuild -->


    <!-- build:js(.) scripts/plugins.js -->
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/affix.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/alert.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/dropdown.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/tooltip.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/modal.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/transition.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/button.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/popover.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/carousel.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/scrollspy.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/collapse.js"></script>
    <script src="/bower_components/bootstrap-sass/assets/javascripts/bootstrap/tab.js"></script>
    <!-- endbuild -->


    <!-- build:js(.tmp) scripts/main.js -->
    <script src="scripts/main.js"></script>
    <!-- endbuild -->

    <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
    <script>
      (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
      function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
      e=o.createElement(i);r=o.getElementsByTagName(i)[0];
      e.src='https://www.google-analytics.com/analytics.js';
      r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
      ga('create','UA-XXXXX-X');ga('send','pageview');
    </script>
  </body>
</html>

我的index.html里面有17个)，而且都有一个开口(，我找不到问题，也看不懂，因为我没有改变任何东西。我只是想看看是否一切正常。

Answer 1

如果那是您的整个 Gruntfile，那么我不确定是什么问题。但如果有 imagemin 任务，请检查模板是否有额外的 %。参见：

useminprepare:html 意外的令牌

useminprepare:html Unexpected Token

javascript

web-applications

gruntjs

yeoman

grunt-usemin