javascript - How to gulp build index.html reference assets with absolute paths? -


scaffolded yeoman web application gulp-angular.

my gulp build process outputs dist/index.html file references assets using relative paths:

<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> 

how force gulp use absolute paths instead?

e.g. /scripts/ instead of scripts/ , /styles/ instead of styles/

here's excerpt of current 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` automatically populate bower styles dependencies -->     <!-- endbower -->     <!-- endbuild -->      <!-- build:css({.tmp/serve,src}) styles/app.css -->     <!-- inject:css -->     <!-- css files automatically insert here -->     <!-- endinject -->     <!-- endbuild -->   </head>   <body>     ...     <!-- build:js(src) scripts/vendor.js -->     <!-- bower:js -->     <!-- run `gulp inject` automatically populate bower script dependencies -->     <!-- endbower -->     <!-- endbuild -->      <!-- build:js({.tmp/serve,.tmp/partials,src}) scripts/app.js -->     <!-- inject:js -->     <!-- js files automatically insert here -->     <!-- endinject -->   </body> </html> 

simply change file paths specified in <!-- build: ... --> comments; gulp uses them explicitly built targets!

<html>   <head>     ...     <!-- build:css({.tmp/serve,src}) /styles/vendor.css -->     <link rel="stylesheet" href="app/vendor.css">     <!-- bower:css -->     <!-- run `gulp inject` automatically populate bower styles dependencies -->     <!-- endbower -->     <!-- endbuild -->      <!-- build:css({.tmp/serve,src}) /styles/app.css -->     <!-- inject:css -->     <!-- css files automatically insert here -->     <!-- endinject -->     <!-- endbuild -->   </head>   <body>     ...     <!-- build:js(src) /scripts/vendor.js -->     <!-- bower:js -->     <!-- run `gulp inject` automatically populate bower script dependencies -->     <!-- endbower -->     <!-- endbuild -->      <!-- build:js({.tmp/serve,.tmp/partials,src}) /scripts/app.js -->     <!-- inject:js -->     <!-- js files automatically insert here -->     <!-- endinject -->   </body> </html> 

Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -