Browserify输出代码不在浏览器中执行

时间:2015-11-13 03:50:07

标签: javascript browserify

可能之前有人提出过这个问题,但我已经阅读了过去4小时内发现的所有内容,但我仍然不明白它是如何工作的,我放弃了。 我有main.js代码:

var hello = require('./hello.js');
hello.helloWorld();

带代码的hello.js:

exports.helloWorld = function () {
    alert('Hello browserify world!');
}

然后我按照文档说的那样做:

browserify main.js -o packed.js

结果packed.js现在包含:

(function e(t, n, r) {
    function s(o, u) {
        if (!n[o]) {
            if (!t[o]) {
                var a = typeof require == "function" && require;
                if (!u && a)return a(o, !0);
                if (i)return i(o, !0);
                var f = new Error("Cannot find module '" + o + "'");
                throw f.code = "MODULE_NOT_FOUND", f
            }
            var l = n[o] = {exports: {}};
            t[o][0].call(l.exports, function (e) {
                var n = t[o][1][e];
                return s(n ? n : e)
            }, l, l.exports, e, t, n, r)
        }
        return n[o].exports
    }

    var i = typeof require == "function" && require;
    for (var o = 0; o < r.length; o++)s(r[o]);
    return s
})({
    1: [function (require, module, exports) {
        (function e(t, n, r) {
            function s(o, u) {
                if (!n[o]) {
                    if (!t[o]) {
                        var a = typeof require == "function" && require;
                        if (!u && a)return a(o, !0);
                        if (i)return i(o, !0);
                        var f = new Error("Cannot find module '" + o + "'");
                        throw f.code = "MODULE_NOT_FOUND", f
                    }
                    var l = n[o] = {exports: {}};
                    t[o][0].call(l.exports, function (e) {
                        var n = t[o][1][e];
                        return s(n ? n : e)
                    }, l, l.exports, e, t, n, r)
                }
                return n[o].exports
            }

            var i = typeof require == "function" && require;
            for (var o = 0; o < r.length; o++)s(r[o]);
            return s
        })({
            1: [function (require, module, exports) {

            }, {}]
        }, {}, [1]);

    }, {}]
}, {}, [1]);

无论原始的main.js包含哪个看起来都一样(我尝试了一些大的反应js代码) 根据文档,我只需要在<script>标记中将其包含在我的页面中 当然,它不起作用。那有什么不对?两个功能完全相同。 我跳过它,但我不能,因为我需要React Router哪个依赖应该以这种方式解决...

更新:根据NodeJS风格添加了另一个尝试。

_______________ UPDATE_________________
我似乎花了太长时间坐在笔记本电脑前。我把文件混淆了路径,所以试图处理空文件。

1 个答案:

答案 0 :(得分:0)

Browserify旨在获取Node.js样式代码并使其在浏览器中工作。这意味着您应该使用Node.js / CommonJS模块样式。

您不需要使用window.onload,因为主js文件中的任何内容都会执行。

如果你想使用react,你需要使用NPM安装模块,然后在你的JS文件中需要它。

var react = require('react');

react.blah();

尝试按照http://www.sitepoint.com/getting-started-browserify/这样的指南进行操作,如果能够使用它,那么就可以将它作为代码的起点。