shonny-ua/gulp-rev-collector

it doesn't replace dependency

Closed this issue · 4 comments

I'm using TS with import, for example in app.module.ts I have:
import {CheckedDirective} from "./common/directives/checked.directive";

checked.directive is a TS in that directory.

With gulp-rev, after tsc, it is correctly revisioned as: checked-0a90e14b3d.directive.js
and inserted in manifest
"app/common/directives/checked.directive.js": "app/common/directives/checked-0a90e14b3d.directive.js",

gulp-rev-collector doesn't rewrite the dependency in "app/app-c3170cc5cd.module.js", it remains:
var checked_directive_1 = require("./common/directives/checked.directive");

What can I do?
My gulp tasks:

`gulp.task('revision:rename', () =>
gulp.src([
BUILD_DIR+"//*.html",
BUILD_DIR+"/
/.css",
BUILD_DIR+"/**/
.js",
"!"+BUILD_DIR+"/index.html",
"!"+BUILD_DIR+"/favicon.ico",
BUILD_DIR+"/**/*.{jpg,png,jpeg,gif,svg,ico,PNG}"])
.pipe(rev())
.pipe(gulp.dest(DIST_ASSEMBLE))
.pipe(rev.manifest({ path: 'manifest.json' }))
.pipe(gulp.dest(DIST_ASSEMBLE))
);

//update references in js but not rewrite
//import {CheckedDirective} from "./common/directives/checked.directive";
//in import {CheckedDirective} from "./common/directives/checked-0a90e14b3d.directive";

gulp.task("revision:updateReferences", () =>
gulp.src([DIST_ASSEMBLE+"/manifest.json","distassemble/**/*.{html,json,css,js}"])
.pipe(collect())
.pipe(gulp.dest(DIST_ASSEMBLE))
);`

You car reach the result:

  1. using gulp-rev-collector v1.3.0
  2. change your manifest to
"common/directives/checked.directive.js": "common/directives/checked-0a90e14b3d.directive.js",

or change require call to

var checked_directive_1 = require("../app/common/directives/checked.directive");
  1. using extMap option for gulp-rev-collector like:
var revCollector = require('gulp-rev-collector');
...
.pipe( revCollector({
            extMap: {
                '.directive.js': '.directive'
            }
}) )
...

Thanks for your response but:

  1. manifest: why removing initial "app" is important? I think problem is the extension .js that isn't in my import (TS) /require (JS). Also each time I must rewrite my manifest? It's about 5000rows!

  2. I can't change require call
    var checked_directive_1 = require("../app/common/directives/checked.directive");
    cause all js are automatically generated from typescript with TSC (gulp previous task).
    The chain is: program in TS --> gulp tsc to automatically obtain .js that I don't change --> gulp rev + gulp collector

  3. With extMap I must write all dependeces manually? I've a lot (a lot!) import for each TS/JS, and in this way what's the help of gulp-rev-collector?
    Example for 1 file:
    import {HasPermissionDirective} from "./common/directives/hasPermission.directive"; import {PermissionService} from "./permission/permission.service"; import {UserService} from "./admin/user/user.service"; import {LoggingService} from "./admin/logging/logging.service"; import {OrderBy} from "./common/pipes/orderBy.pipe"; import {UserRegionsPanelComponent} from "./admin/user/detail/user-regions-panel.component"; import {UserTipieventoPanelComponent} from "./admin/user/detail/user-tipievento-panel.component"; import {MessageService} from "./common/services/message.service"; import {HttpResponseHandlerService} from "./app.httpResponseHandler.service"; import {RoleService} from "./admin/role/role.service"; import {UserListPipe} from "./admin/user/list/user-list.pipe";

I missing something: import in TS is a standard, so why collector doesn't recognize it?

  1. yes! my module cant find pattern app/common/directives/checked.directive in string ./common/directives/checked.directive to replacement. without serios rewrite it can`t.
    you can modify content of your manifests before using collector.
    ETC:
var through         = require('through2');
through

function replacer() {
    return through.obj(function(file, enc, cb){
        if (path.extname(file) === '.json') {
            var src = file.contents.toString('utf8');
            src = src.replace(/"app\//g, '"/');
            file.contents = new Buffer(src);
        }
        this.push(file);
        cb();
    });
}
...

gulp.task("revision:updateReferences", () =>
gulp.src([DIST_ASSEMBLE+"/manifest.json","distassemble/**/*.{html,json,css,js}"])
.pipe(replacer())
.pipe(collect({extMap: {
                '.directive.js': '.directive',
                '.service.js': '.service',
                '.pipe.js': '.pipe',
                '.module.js': '.module'
            }}))
.pipe(gulp.dest(DIST_ASSEMBLE))
);

without 5000 rows modyfy...
2. if you realise 1, it don't needed.
3. yes. you need rules for .directive, .service, .pipe... what else? .module...
isn't a "lot" variants. copypast them from exsample below...

thanks for your reply

  1. In this code there are a lot of custom pattern for file names used in import/require. Example for another generated js:
    var utilService_1 = require("./admin/utilService");
    var persone_component_1 = require("./event/detail/panelModal/persone-component");
    var inputswitch_1 = require("primeng/components/inputswitch/inputswitch");
    var risorse_materiali_component_1 = require("./event/detail/panelModal/risorse-materiali-component");
    ...

different from file to file, so I thinking there is no simple way to rev and replace dependencies in my case with gulp-rev and gulp-rev-collector :(
I hoped that there was a plugin for automatically scan and then rev and replace all "import" present in all my TS (all "require" in all generated JS)