Question

Bower与jspm有何不同？ Bower能否提供关于SystemJS universal module loader的jspm功能？

Answer 1

与Bower相比，JSPM是一个更大，更雄心勃勃的项目。 Bower只有一个目的 - 将您需要的源文件从Web下载到硬盘。对于你作为消费者，凉亭并没有做任何其他事情。如果要从bower执行脚本文件，则需要为每个脚本文件创建脚本标记。

虽然jspm不仅是一个模块下载器。它默认下载你提到的systemjs。 SystemJS尽可能紧密地实现https://whatwg.github.io/loader/。实际上，JSPM的作者是规范过程的非常积极的参与者。使用systemjs，今天您可以在浏览器中加载ES6（通过在浏览器中进行转换），CommonJS或AMD模块，而无需构建它们。不仅是ES6模块，还有traceur / babeljs / typescript支持的所有其他ES6功能。取决于您在运行jspm init时选择的编译器。 SystemJS在node.js和浏览器中以1：1的方式运行，因此可以轻松完成对应用程序的单元测试。

当您需要进行制作时，它还可以为您（jspm build）构建捆绑包。所以很明显jspm（+ systemjs）是一个更强大的工具。所以作为经验法则：

需要快速获取jquery并将其包含在您的服务器端模板化html中？使用常规脚本标记。 Bower已被弃用。
需要构建大型JS应用程序吗？使用Webpack。 JSPM未能达到临界质量，现在每个人都在做webpack。

Answer 2

再加上Capaj的答案：

如果你有一个小项目，无论如何都要使用jspm！这是未来！（谁知道，事情会发生变化，但这是一个不错的选择）。

小项目使用：

$ jspm install jquery

然后在你的HTML中：

    <script src="jspm_packages/system.js"></script><!-- required -->
    <script src='config.js'></script><!-- required -->
    <script type="module">
        System.import('path/to/your/main.js')
    </script>

然后在main.js：

import $ from 'jquery'; // ES6-style import
// do whatever with jQuery here.

您可以使用CommonJS，AMD或ES 6模块格式。 JSPM会在您的文件中自动检测它们（但您不能在同一文件中混合和匹配）。

var $ = require('jquery'); // CommonJS-style import
// do whatever with jQuery here.

define(['jquery'], function($) { // AMD-style import
    // do whatever with jQuery here.
})

包管理器：Bower vs jspm

2 个答案: