Get Browserify erfordern Pfade zu verhalten mehr wie requirej

Question

Ich finde, dass es ein Schmerz ist, wenn Dateien umher verschieben und ständig die Datei Include-Pfade neu schreiben müssen relativ zu ihrem neuen Ordner.

Ich möchte dies in meinem browserify Code vermeiden:

var View = require('../../../../base/view'); 

Und mit requirejs etwas mehr in Einklang tun, wo es meine Basis Weg kennt, ist js:

var View = require('base/view'); 

Answer 1

Sie die paths verwenden sollten Möglichkeit. Es ist nicht in browserify dokumentiert, sondern in node-browser-resolve (unter der Haube verwendet wird):

Pfade - require.paths Array zu verwenden, wenn nichts auf den normalen gefunden wird node_modules rekursive Spaziergang

Answer 2

node_modules

Sie können Ihren Anwendungscode (oder einen Symlink dazu, sofern Ihre Plattform dies unterstützt) unter node_modules eingeben. ZB:

node_modules/ 
+-- app/ 
    +-- js/ 
     +-- base/ 
      +-- view.js 
     +-- a/ 
      +-- b/ 
       +-- c/ 
        +-- somefile.js 

// somefile.js     
require("app/js/base/view"); 

jedoch, dann ist es eine wichtige Einschränkung: diese bricht Anwendung von Transformationen programmatisch über die API angegeben, zB:

browserify('app/entry.js') 
    .transform(es6ify) 

In browserify gibt es ein Konzept der „top- Level "Dateien, die mit Transformationen ins Spiel kommen. Dieses Konzept und das Verhalten von Transformationen im Allgemeinen wird in der Dokumentation zu browserify nur unzureichend erläutert. Sie können einige Diskussion über die Frage hier sehen: substack/node-browserify#993

pathmodify

Eine weitere Option ist mein pathmodify browserify Plugin. Dies ermöglicht die Verwendung von nicht relativen Pfaden und programmatischen Transformationen.

var View = require('base/view'); 

Sie tun würde, so etwas wie: browserifying Code wie ermöglichen

var pathmodify = require('pathmodify'); 

var opts = {mods: [ 
    // Maps require() IDs beginning with "base/" to begin with 
    // "/somedir/js/base/" 
    pathmodify.mod.dir("base", "/somedir/js/base"), 
]}; 

// Give browserify the real path to entry file(s). 
// pathmodify will transform paths in require() calls. 
browserify('./js/entry') 
    .plugin(pathmodify, opts) 
    .transform(es6ify) 
    .bundle() 
    ... 

Kombinierte

Beachten Sie, dass pathmodify wird das Problem nur für browserify lösen. Wenn Sie die Pfade wie base/view benötigen, um auch in einem anderen Kontext zu arbeiten, wie Knoten, dann können Sie, wenn Sie Symlinks zur Verfügung haben, beide kombinieren. Beispiel: symbolisch node_modules/base bis /somedir/js/base und auch pathmodify wie angegeben konfigurieren und weiterhin auf Pfade außerhalb von node_modules für Eintragsdateien verweisen.

Answer 3

Eine gute Option ist hier das aliasify Plugin zu verwenden, verfügbar here.Dann einfach, so etwas zu Ihrem package.json hinzufügen, mit allen Pfaden in der aliasify Config auf die Position der Datei bezogen ist:

"browserify": { 
    "transform": [ 
     "aliasify" 
    ] 
    }, 
    "aliasify": { 
    "aliases": { 
     "app": "./src/app", 
     "components": "./src/components", 
     "someAlias": "./src/app/some/path/to/a/place", 
     "foobar": "./go/to/a/module/named/foobar", 
    } 
    } 

Dann in Ihren Dateien, tut gerade:

var foobar = require("foobar"); 
var sampleComponent = require("components/someSample"); 

//My JS code