javascript - grunt-bower-install 将 bower_components 链接到当前目录

Question

我最近开始了一个新项目，使用 Yeoman Angular 生成器与 Grunt 和 Bower。

每当 grunt 构建我的应用程序时，grunt-bower-install 都会在 index.html 文件中重新生成指向我的 bower_components 的所有链接。

无论出于何种原因，这些 Assets 都链接到当前目录而不是根目录，因此当我导航到一个深度超过一层的新 Url 时，我的所有依赖项都会中断。

如何使组件链接到根目录而不是当前目录？

当前结果:

<script src="bower_components/modernizr/modernizr.js"></script>

期望的结果:

<script src="/bower_components/modernizr/modernizr.js"></script>

Grunt 文件:

'bower-install': {
  app: {
    html: '<%= yeoman.app %>/index.html',
    ignorePath: '<%= yeoman.app %>/'
  }
}

Answer 1

我和 yo 1.1.2 有同样的问题，这就是我解决问题的方法，在 Gruntfile.js 中，在 wiredep 任务中添加 fileTypes 选项:

// Automatically inject Bower components into the app
wiredep: {
  app: {
    src: ['<%= yeoman.app %>/index.html'],
    ignorePath: new RegExp('^<%= yeoman.app %>/|../'),
    fileTypes: {
      html: {
        replace: {
          js: '<script src="/{{filePath}}"></script>',
          css: '<link rel="stylesheet" href="/{{filePath}}" />'
        }
      }
    }
  }
},