Bower初始化- amd, es6，全局和节点之间的区别

小开

最佳答案

如果你不知道，很可能全局变量是你的正确答案。

不管怎样，你需要明白:

(更新)

这个功能是最近才在bowwer中引入的，还没有被记录下来(AFAIK)。它本质上描述了moduleType，它声明了包将用于何种模块技术(见上文)。

现在，除了在包的bower.json文件中设置moduleType属性外，它没有任何效果。

参见https://github.com/bower/bower/pull/934获取原始的pull-request。

(更新# 2)

为了回答评论，我还要补充几点:

现在还没有对moduleType属性进行验证——这意味着技术上允许人们使用他们想要的任何值，包括angularjs，如果他们想这样做的话
鲍尔委员会似乎并不热衷于包含额外的non-interoperable/proprietary moduleTypes(想想composer, angular等)——这很容易理解，但同样，没有什么真正阻止人们使用他们想要的moduleType值
前面的一个例外是yui moduleType(有点)最近的包含，因此，有“例外”要做，假设它们是这是一个一致计划的一部分

如果我要为未列出的包管理器编写一个包并将其发布到bower上，我会做什么?

我会创建一个es6模块，并使用/ patch es6-transpiler来输出我需要的包格式。那么我将/和:

请求bower的家伙把我的包技术作为一种选择(基于es6-transpiler作为目标支持它的事实)
发布我的包，包括它的es6模块版本和它的编译后的XXX版本，并使用es6作为moduleType

免责声明:我没有编写angularjs模块的实际经验。

小开

最初的

我也是第一次使用bower init。

选项应该指模块化JavaScript代码的不同方式:

amd:使用amd define，像requirejs。
node:使用node .js require。
globals:使用JavaScript模块模式公开全局变量(如window.JQuery)。
es6:使用即将推出的EcmaScript6模块特性。

在我的例子中，我写了一个Node.js模块dflow，但我使用browserify来创建一个dist / dflow.js文件，导出一个全局dflow变量:所以我选择了全局变量。

其他的更新

我用来将dflow浏览为窗口全局对象的命令是

< p > <代码> Browserify -s dflow -e index.js -o dist/dflow.js < /代码> < / p >

我改变了它，因为我更喜欢在浏览器内部使用需要，所以现在我正在使用

< p > <代码> Browserify -r ./index.js:dflow -o dist/dflow.js < /代码> < / p >

所以我在我的bower.json文件中将bower.moduleType改为节点。

主要的动机是，如果我的模块名有破折号，例如我的项目连，我需要在flowView中camelize全局名称。

这种新方法还有两个好处:

节点和浏览器界面相同。在客户端和服务器端都使用需要，让我只编写一次代码示例，并在两个上下文中轻松重用它们。
我使用npm脚本，因此，我可以利用${npm_package_name}变量，并编写一次我用于browserify的脚本。

这是另一个话题，但是，你真的值得考虑后一个好处是如何有用的:让我分享我在package.json中使用的npm.scripts.browserify属性

"browserify": "browserify -r ./index.js:${npm_package_name} -o dist/${npm_package_name}.js"

小开

仅供参考，这正是bower针对模块类型指定的内容:

main JavaScript文件中定义的模块类型。可以是以下字符串中的一个或一个数组:

globals:使用window.namespace或this.namespace语法添加全局命名空间的JavaScript模块

amd:与AMD兼容的JavaScript模块，比如RequireJS，使用define()语法

node:使用module.exports语法与节点和CommonJS兼容的JavaScript模块

es6:与ECMAScript 6模块兼容的JavaScript模块，使用export和import语法

yui:与YUI模块兼容的JavaScript模块，使用YUI.add()语法