Question

使用gulp-angular支持Yeoman Web应用程序。

我的gulp build进程输出一个dist/index.html文件，该文件使用相对路径引用资产：

<html>
  <head>
    ...
    <link rel="stylesheet" href="styles/vendor-f57bbe49.css">
    <link rel="stylesheet" href="styles/app-a0b8907b.css">
  </head>
  <body>
    ...
    <script src="scripts/vendor-a30f25be.js"></script>
    <script src="scripts/app-b7f411d9.js"></script>
  </body>
</html>

如何强制Gulp使用绝对路径呢？

E.g。 /scripts/代替scripts/和/styles/代替styles/

这是我当前src/index.html的摘录：

<html>
  <head>
    ...
    <!-- build:css({.tmp/serve,src}) styles/vendor.css -->
    <link rel="stylesheet" href="app/vendor.css">
    <!-- bower:css -->
    <!-- run `gulp inject` to automatically populate bower styles dependencies -->
    <!-- endbower -->
    <!-- endbuild -->

    <!-- build:css({.tmp/serve,src}) styles/app.css -->
    <!-- inject:css -->
    <!-- css files will be automatically insert here -->
    <!-- endinject -->
    <!-- endbuild -->
  </head>
  <body>
    ...
    <!-- build:js(src) scripts/vendor.js -->
    <!-- bower:js -->
    <!-- run `gulp inject` to automatically populate bower script dependencies -->
    <!-- endbower -->
    <!-- endbuild -->

    <!-- build:js({.tmp/serve,.tmp/partials,src}) scripts/app.js -->
    <!-- inject:js -->
    <!-- js files will be automatically insert here -->
    <!-- endinject -->
  </body>
</html>

Answer 1

只需更改条评论中指定的文件路径即可; Gulp明确地使用它们来构建目标！

<html>
  <head>
    ...
    <!-- build:css({.tmp/serve,src}) /styles/vendor.css -->
    <link rel="stylesheet" href="app/vendor.css">
    <!-- bower:css -->
    <!-- run `gulp inject` to automatically populate bower styles dependencies -->
    <!-- endbower -->
    <!-- endbuild -->

    <!-- build:css({.tmp/serve,src}) /styles/app.css -->
    <!-- inject:css -->
    <!-- css files will be automatically insert here -->
    <!-- endinject -->
    <!-- endbuild -->
  </head>
  <body>
    ...
    <!-- build:js(src) /scripts/vendor.js -->
    <!-- bower:js -->
    <!-- run `gulp inject` to automatically populate bower script dependencies -->
    <!-- endbower -->
    <!-- endbuild -->

    <!-- build:js({.tmp/serve,.tmp/partials,src}) /scripts/app.js -->
    <!-- inject:js -->
    <!-- js files will be automatically insert here -->
    <!-- endinject -->
  </body>
</html>

如何用绝对路径吞噬构建index.html参考资产？

1 个答案: