gulp-map-transform
TypeScript icon, indicating that this package has built-in type declarations

0.0.4 • Public • Published

gulp-map-transform

Version CircleCI License

Easily transform virtual paths inside any file to real paths

Install

Install via npm:

npm install --save-dev gulp-map-transform

Usage

Transforming scss paths to compiled css paths

Given this section of a html file:

...
<head>
  <link rel="stylesheet" href="@styles/test.scss" />
</head>
...

And this configuration inside your gulpfile

const { src, dest } = require('gulp');
const sass = require('gulp-sass');
const mapTransform = require('gulp-map-transform');
 
const OUT_PATH = '/dist/folder';
 
src('/html/files/**/*.html')
  .pipe(
    mapTransform({
      search: /href="@styles\/(.*?).scss"/gi,
      replace: /"(.*?)"/i,
      rootPath: OUT_PATH,
      rewrite: (path) => path.replace('@styles', 'css/files'),
      transform: (stream) => stream
        .pipe(sass())
        .pipe(dest(path.join(OUT_PATH, 'css')))
    })
  )
  .pipe(dest(OUT_PATH))

This will generate the following html file after compiling the css file:

...
<head>
  <link rel="stylesheet" href="/css/files/test.css" />
</head>
...

Options

Name Type Required Description
search RegExp yes This expression is used to identify in which location you want to execute a transformation of the content
replace RegExp yes This is used to replace the path of the file inside a result of the search matches
rewrite Function yes Use this to tell what and how to replace the path inside the string found by the replace expression
transform Function yes In this callback you get a separate stream to handle all your files already present with the real path
rootPath string no The root path to which the transfomed file paths will be appended (with path.relative())

License

See the LICENSE file for license rights and limitations (MIT).

Package Sidebar

Install

npm i gulp-map-transform

Weekly Downloads

2

Version

0.0.4

License

MIT

Unpacked Size

13.6 kB

Total Files

6

Last publish

Collaborators

  • davideperozzi