javascript 获取 browserify 需要路径的行为更像 requirejs
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/22051663/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get browserify require paths to behave more like requirejs
提问by Abadaba
I'm finding that it's a pain when moving files around and constantly having to rewrite the file include paths to be relative to their new folder.
我发现四处移动文件并且经常不得不重写文件包含路径以使其相对于他们的新文件夹是一种痛苦。
I want to avoid this in my browserify code:
我想在我的浏览器代码中避免这种情况:
var View = require('../../../../base/view');
And do something more in line with requirejs where it knows my base path is js
:
做一些更符合 requirejs 的事情,它知道我的基本路径是js
:
var View = require('base/view');
回答by eightyfive
You should use the paths
option. It is not documented in browserify but in node-browser-resolve(used under the hood):
您应该使用该paths
选项。它没有记录在 browserify 中,而是在node-browser-resolve 中(在后台使用):
paths - require.paths array to use if nothing is found on the normal node_modules recursive walk
路径 - 如果在正常的 node_modules 递归遍历中未找到任何内容,则使用 require.paths 数组
回答by AlexZ
A great option here is to use the aliasify
plugin, available here. Then just add something like this to your package.json
, with all paths in the aliasify config being relative to the position of that file:
一个很好的选择是使用aliasify
插件,可在此处获得。然后只需将这样的内容添加到您的package.json
,aliasify 配置中的所有路径都相对于该文件的位置:
"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",
}
}
Then, in your files, just do:
然后,在您的文件中,只需执行以下操作:
var foobar = require("foobar");
var sampleComponent = require("components/someSample");
//My JS code
回答by JMM
node_modules
node_modules
You can put your application code (or a symlink to it, if your platform supports it) under node_modules
. E.g.:
您可以将应用程序代码(或指向它的符号链接,如果您的平台支持)放在node_modules
. 例如:
node_modules/
+-- app/
+-- js/
+-- base/
+-- view.js
+-- a/
+-- b/
+-- c/
+-- somefile.js
// somefile.js
require("app/js/base/view");
However, there's an important caveat: this breaks application of transforms specified programmatically via the API, e.g:
但是,有一个重要的警告:这会破坏通过 API 以编程方式指定的转换的应用,例如:
browserify('app/entry.js')
.transform(es6ify)
In browserify there's a concept of "top-level" files that comes into play with transforms. That concept, and the behavior of transforms in general, is poorly explained in the browserify documentation. You can see some discussion of the issue here: substack/node-browserify#993
在 browserify 中,有一个“顶级”文件的概念与转换有关。这个概念,以及一般的转换行为,在 browserify 文档中没有很好地解释。你可以在这里看到关于这个问题的一些讨论:substack/node-browserify#993
pathmodify
路径修改
Another option is my pathmodifybrowserify plugin. This allows using non-relative paths and programmatic transforms. To enable browserifying code like:
另一种选择是我的pathmodify browserify插件。这允许使用非相对路径和程序化转换。要启用浏览器代码,例如:
var View = require('base/view');
You would do something like:
你会做这样的事情:
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()
...
Combined
组合
Note that pathmodify will only solve the problem for browserify. If you need the paths like base/view
to also work in another context, like node, then if you have symlinks available you can combine the two. For example, symlink node_modules/base
to /somedir/js/base
, and also configure pathmodify as indicated and continue to point browserify to paths outside of node_modules
for entry files.
注意 pathmodify 只会解决 browserify 的问题。如果您需要路径base/view
也可以在另一个上下文中工作,例如节点,那么如果您有可用的符号链接,则可以将两者结合起来。例如,符号链接node_modules/base
到/somedir/js/base
,并且还按照指示配置 pathmodify 并继续将 browserify 指向node_modules
for 条目文件之外的路径。