2. Fórumok
  3. Szoftverfejlesztés
  4. JavaScript topic
Keresés
  • Fototrend
    Frissítve: 2014-02-25 10:20 Téma összefoglaló
    Fototrend

    JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)

Új hozzászólás Aktív témák

  • Jim-Y Jim-Y veterán
    #4808
    #4804 Zedz
    Új Válasz
    Új hozzászólás
    Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra
    Jim-Y
    Jim-Y
    veterán
    #4804 Zedz
    #4804 Zedz

    ES6 bocsánat, elírtam. :))

    Ezt a "Browserify"-t már többször láttam említve, most gyorsan kicsit utánanéztem. Ez egy olyan tool, ami segít elszeparálni a JS kódunkat? Majd a végén egy bundlebe rakja őket?

    Köszi a tippet, ez a 6to5 szimpatikusnak tűnik. :)

    (#4803) Jim-Y akkor ezek már ES6 fícsörök?

    Gondoltam megmutatom, hogy hogy működik a browserify, mert viszonylag egyszerűen be lehet mutatni:

    Vannak a forrás fájlok:

    .
    ├── app.js
    ├── index.html
    ├── module1.js
    ├── module2.js
    └── node_modules
    └── browserify

    module1
    =======

    'use strict';
    module.exports.hello = function(world) {
    return 'hello, ' + world();
    };

    module2
    =======

    'use strict';
    module.exports.world = function() {
    return 'world!';
    };

    app
    ===

    'use strict';

    var module1 = require('./module1.js'),
    module2 = require('./module2.js');

    document.querySelector('body > div > p').innerText = module1.hello(module2.world);

    Majd itt használjuk fel a browserify-t egy bundle készítésre, terminálban a gyökér könyvtárban ki kell adni ezt a parancsot:

    browserify app.js > bundle.js

    index.html
    ========

    <!DOCTYPE html>
    <head>
    <title>Browserify</title>
    </head>
    <body>
    <div>
    <p></p>
    </div>
    <script src="bundle.js"></script>
    </body>
    </html>

    Tehát a html-be már csak a bundle-t húzzuk be, illetve a webszerverre/CDN-re is már csak a bundle-t kell feltenni.

    A bundle pedig ezt tartalmazza:

    (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){
    'use strict';

    var module1 = require('./module1.js'),
    module2 = require('./module2.js');

    document.querySelector('body > div > p').innerText = module1.hello(module2.world);
    },{"./module1.js":2,"./module2.js":3}],2:[function(require,module,exports){
    'use strict';

    module.exports.hello = function(world) {
    return 'hello, ' + world();
    };
    },{}],3:[function(require,module,exports){
    'use strict';

    module.exports.world = function() {
    return 'world!';
    };
    },{}]},{},[1]);

    Sok-sok olvashatatlan dolog, de látszik, hogy végső soron a te fájlaidat rakja össze.
    Üdv

  • Jim-Y Jim-Y veterán
    #4805
    #4804 Zedz
    Új Válasz
    Új hozzászólás
    Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra
    Jim-Y
    Jim-Y
    veterán
    #4804 Zedz
    #4804 Zedz

    ES6 bocsánat, elírtam. :))

    Ezt a "Browserify"-t már többször láttam említve, most gyorsan kicsit utánanéztem. Ez egy olyan tool, ami segít elszeparálni a JS kódunkat? Majd a végén egy bundlebe rakja őket?

    Köszi a tippet, ez a 6to5 szimpatikusnak tűnik. :)

    (#4803) Jim-Y akkor ezek már ES6 fícsörök?

    Ez egy olyan tool ami lehetővé teszi, hogy node/iojs környezetben CommonJS-ben írt modulokat tudsz browser környezetben használni. Ezt igen úgy éri el, hogy a require direktívákkal behúzott modulokat egy bundle fájlba "csomagolja".

    Igen ezek ES6-os újítások.

Új hozzászólás Aktív témák