Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cannot compile es6 module source

See original GitHub issue

NWJS Version : v0.26.6 Operating System : macOS 10.13.1 (HighSierra)

Now we already can use es6 module features in v0.26.6 (Chrome 62). One example is:

` -------------lib.js--------------

// lib.js class TestModule { foo() { console.log(‘—foo----’); } }

export {TestModule};

-----------testmodule.js---------------- // testmodule.js import {TestModule} from “./lib.js”;

var f = new TestModule(); f.foo();

-----------index.html----------------

<html>

<body>
    <script type="module" src="testmodule.js"></script>
    Hello.
</body>

</html>

----------package.json----------- { “name”: “helloworld”, “main”: “index.html”, “dependencies”: {} } `

The above example can work properly. However, nwjc tool cannot compile them to binary code. The error message is: ` $/Applications/nwjs/nwjc lib.js lib.bin

Failure compiling ‘lib.js’ (see above) `

What’s the correct procedure to use es6 module with nwjc? This is important for large scale application.

Thanks.

Issue Analytics

State:
Created 6 years ago
Reactions:1
Comments:67 (21 by maintainers)

Top GitHub Comments

9reactions

manujozcommented, Feb 21, 2020

For people who are having problems loading the es6 modules, I leave here as I do in my app so that it can help them.

Estructure:

mymodule_1.js | mymodule_1.bin

export function person( name = "Manu", age = 37, height = 180 ) {
    return {
        name: name,
        age: age,
        height : height ,
    }
}

mymodule_2.js | mymodule_2.bin

import { person as Person } from "./mymodule_1.js";

class ClassRoom {
    constructor() {
         this.students = [];
    }

    set_student( name, age, height ) {
        this.stundents.push( Person( name, age, height ));
    }

    num_students() {
        return this.stundents.length;
    }
}

const classroom = new ClassRoom();
export { classroom };

myscript.js | myscript.bin

import { classroom as Classroom } from "./mymodule_2.js";

class App {
    constructor() {
        Classroom.set_student( "Manu", 37, 180 );
        document.querySelector( "h1" ).innerHTML = "Num of students in classroom: " + Classroom.num_students();
    }
}

const app = new App();
export { app };

index.html

<html>
    <head></head>
    <body>
        <h1></h1>

        <!-- Importing modules -->
        <script>nw.Window.get().evalNWBinModule( null, './src/modulesES6/mymodule_1.bin', './mymodule_1.js' );</script>
	<script>nw.Window.get().evalNWBinModule( null, './src/modulesES6/mymodule_2.bin', './mymodule_2.js' );</script>

        <!-- Importing scripts -->
	<script>nw.Window.get().evalNWBinModule( null, './src/scripts/myscript.bin', './myscript.js' );</script>

        <script type="module">
            import { app } from "./myscripts.js";
        </script>
    </body>
</html>

Note that the import in ** myscript.js **, I do not put the relative path to the module that I am importing, I put the base path of the app. Where would you have to write import { classroom as Classroom } from" ../ modulesES6 / mymodules_2.js ", write import { classroom as Classroom } from" ./mymodules_2.js ".

You just have to adapt it to the structure of your app and you should not have problems to make it work.

It may seem a bit cumbersome, but with a little skill, I have programmed a compiler that adjusts the import paths in the modules automatically when I compile the application, as well as changing me <script type="module" src=" ../ scripts / mysscript.js"></script> by <script nw.Window.get().evalNWBinModule(null, './src/scripts/myscript.bin', './myscript.js ');</script> in html files also automatically.

So with a single console command, the application is compiled, modifies imports in .js and scripts in html, packaged in exe and zip and uploaded to my repository on my server by FTP ready for users to download or when a user who already has it installed, receive automatic update and install.

It is undoubtedly the ability of nw.js to convert .js files into .bin files that prompted me to switch from electron to nw.js. When I tried nw.js and saw its capabilities I will never go back to electron. Not only because of the protection of the scripts, but also because of the operation of the application’s contexts, the possibility of including Polymer that didn’t work in electron and the non-SDK flavor that doesn’t allow inspecting the app’s windows.

Once you understand nw.js you can easily make node.js an automatic compiler with a little effort that even works better with electron builders.

I hope to help.

1reaction

Mann90commented, Jan 17, 2019

It is not fixed in v0.35.5.

module.js: console.log(‘hello from module’);

Compile: nwjc --nw-module module.js module.bin

Load and run in index.html: win.evalNWBinModule(null, “module.bin”, “module.js”);

The code was not executed at all.