qmljsify - Convert an NPM package into a QML friendly JavaScript file


  • Qt Champions 2016

    Hello,

    I would like to share a experimental project here. It is qmljsify , a tool that could converts an NPM package into a QML friendly JavaScript file.

    Project Site
    http://www.github.com/e-fever/qmljsify

    Usage: qmljsify [options] command package
    qmljsify - Download and convert an NPM package to a QML friendly JavaScript file
    
    Options:
      -h, --help   Displays this help.
      --no-minify  Turn off JavaScript Compression
    
    Arguments:
      command      Command [Available Commands: convert]
      package      NPM package to be qmljsified
    

    Example:

      qmljsify convert sprintf
    

    Then it will fetch sprintf from NPM and create two files

      sprintf.orig.js # A compiled and minified sprintf library
      sprintf.js # A Wrapper of the compiled sprintf library for QML
    

    That is what sprintf.js looks like:

    .pragma library
    Qt.include("sprintf.orig.js")
    var object_stringify = QML.object_stringify;
    var format = QML.format;
    var cache = QML.cache;
    var parse = QML.parse;
    var sprintf = QML.sprintf;
    var vsprintf = QML.vsprintf;
    

    Then you could use it in your QML file:

    import "./sprintf.js" as SPrintf
    
    // [snipped]
    SPrintf.sprintf("%d %d", 1 , 2);
    

    It is just the first release and not every package works. If you have any problem / suggestion , please feel free to tell me.


  • Lifetime Qt Champion

    Hi,

    Looks nice ! Thanks for sharing !


  • Qt Champions 2016

    Updates: Now, it is supported to handle NPM package that returns a single function likes left-pad and lodash.merge

    e.g

    $ qmljsify convert lodash.merge@4.5.0
    /usr/local/bin/npm install --save --save-exact lodash.merge@4.5.0
    qmljsify@1.0.0 
    └── lodash.merge@4.5.0 
    
    /usr/local/bin/npm install
    /usr/local/bin/webpack --env minify
    Hash: 43529705cfe4a5efa83d
    Version: webpack 2.5.1
    Time: 616ms
        Asset   Size  Chunks             Chunk Names
    bundle.js  13 kB       0  [emitted]  main
       [0] ./index.js 163 bytes {0} [built]
       [1] ./~/lodash.merge/index.js 60.7 kB {0} [built]
       [2] (webpack)/buildin/global.js 509 bytes {0} [built]
       [3] (webpack)/buildin/module.js 517 bytes {0} [built]
       [4] multi ./index.js 28 bytes {0} [built]
    lodash.merge.orig.js  saved
    lodash.merge.js  saved
    

Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.