发表新帖
发表新帖

Browserify - How to call function bundled in a file generated through browserify in browser

前端 未结
关注
11 2153
-上瘾入骨i
-上瘾入骨i 2020-11-29 17:18

I am new to nodejs and browserify. I started with this link .

I have file main.js which contains this code

var unique = require(\'uniq\');

var data
相关标签:
11条回答
  • 萌比男神i
    2020-11-29 18:00

    it's really simple -- this whole concept is about wrapping

    1. alternative - object "this"

    for this purpose I'll assume you have "only 1 script for whole app {{app_name}}" and "1 function {{function_name}}"

    add function {{function_name}} to object "this"

    function {{function_name}}(param) {}
->
this.{{function_name}} = function(param) {}

    then you have to name that object to be available - you will do it add param "standalone with name" like others advised

    so if you use "watchify" with "browserify" use this

    var b = browserify({
    ...
    standalone: '{{app_name}}'
});

    or command line

    browserify index.js --standalone {{app_name}} > index-bundle.js

    then you can call your function from browser

    {{app_name}}.{{function_name}}(param);
window.{{app_name}}.{{function_name}}(param);

    2. alternative - object "window"

    add function {{function_name}} to object "window"

    function {{function_name}}(param) {}
->
window.{{function_name}} = function(param) {}

    then you can call your function from browser

    {{function_name}}(param);
window.{{function_name}}(param);

    --

    maybe I help someone

    0 讨论(0)
  • 星月不相逢
    2020-11-29 18:03

    Read README.md of browserify about --standalone parameter or google "browserify umd"

    0 讨论(0)
  • 南方客
    2020-11-29 18:04 
    window.LogData =function(data){
   return unique(data);
};

    Call the function simply by LogData(data)

    This is just a slight modification to thejh's answer but important one

    0 讨论(0)
  • 醉梦人生
    2020-11-29 18:04

    For debugging purposes I added this line to my code.js:

    window.e = function(data) {eval(data);};

    Then I could run anything even outside the bundle.

    e("anything();");
    0 讨论(0)
  • 忘掉有多难
    2020-11-29 18:05

    Minimal runnable example

    This is basically the same as: https://stackoverflow.com/a/43215928/895245 but with concrete files that will allow you to just run and easily reproduce it yourself.

    This code is also available at: https://github.com/cirosantilli/browserify-hello-world

    index.js

    const uniq = require('uniq');

function myfunc() {
  return uniq([1, 2, 2, 3]).join(' ');
}
exports.myfunc = myfunc;

    index.html

    <!doctype html>
<html lang=en>
<head>
<meta charset=utf-8>
<title>Browserify hello world</title>
</head>
<body>
<div id="container">
</body>
</div>
<script src="out.js"></script>
<script>
document.getElementById('container').innerHTML = browserify_hello_world.myfunc();
</script>
</html>

    Node.js usage:

    #!/usr/bin/env node

const browserify_hello_world = require('./index.js');

console.log(browserify_hello_world.myfunc());

    Generate out.js for browser usage:

    npx browserify --outfile out.js --standalone browserify_hello_world index.js

    Both the browser and the command line show the expected output:

    1 2 3

    Tested with Browserify 16.5.0, Node.js v10.15.1, Chromium 78, Ubuntu 19.10.

    0 讨论(0)
 看不清?
提交回复
热议问题