我如何将 Rangy 与其他模块捆绑在一起？

Question

Rangy 作为核心库发布，rangy-core.js，以及一组内置在单独文件中的可选模块（例如 rangy-serializer.js）。我正在尝试找出将 rangy-core 和我需要的模块捆绑为一个文件的最佳方法。

背景：

我正在创建一些 Javascript 并加载到第 3 方网站。加载时我做的第一件事是拉下我的附加依赖项（jQuery、Ractive、Rangy）。我开始的网络请求数量是一个问题，所以我想避免单独拉下每一块 Rangy。

我试过的：

1) 手动加载。目前，我插入脚本标签来下拉 rangy-core.js ，然后当它加载时我插入标签来下拉额外的模块。这有效，但会导致 4 个网络请求。像这样：

function loadRangy() {
    // loadScript inserts a script tag and then calls
    // back to a function when the script is loaded
    loadScript('//cdnjs.cloudflare.com/ajax/libs/rangy/1.3.0/rangy-core.min.js', function() {
        loadScript('//cdnjs.cloudflare.com/ajax/libs/rangy/1.3.0/rangy-classapplier.min.js');
        loadScript('//cdnjs.cloudflare.com/ajax/libs/rangy/1.3.0/rangy-textrange.min.js');
        loadScript('//cdnjs.cloudflare.com/ajax/libs/rangy/1.3.0/rangy-serializer.min.js');
    });

2) 浏览器化。我试过使用 Browserify 将这 4 个脚本合二为一。我可能做错了，但我尝试的只是：

browserify rangy-*.js -o rangy-combined.js

这爆炸了：

Error: Cannot find module 'rangy' from '/Users/foo/bar/rangy/1.3.0'
at /usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:46:17
at process (/usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:173:43)
at ondir (/usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:188:17)
at load (/usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:69:43)
at onex (/usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:92:31)
at /usr/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:22:47
at Object.oncomplete (fs.js:107:15)

Answer 1

我不确定它是否是 recommended/best 方法，但我发现我可以简单地连接文件并且一切似乎都有效（只要我将 rangy-core 放在第一位）。使用 Grunt，它看起来像这样：

/*global module:false*/
module.exports = function(grunt) {

    // Project configuration.
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        concat: {
            rangy: {
                src: [ '../rangy/1.3.0/uncompressed/rangy-core.js', '../rangy/1.3.0/uncompressed/*.js' ],
                dest: ‘../lib/rangy-combined.js’
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-concat');

    grunt.registerTask('rangy', [ 'concat:rangy' ]);

};

我如何将 Rangy 与其他模块捆绑在一起？

How can I bundle Rangy along with additional modules?

browserify

rangy