Importing external ES6 modules

[Andrew Kimpton]

I have a project being built with the 20160315 version of the compiler, I use the closure compilers own module mechanism to group my code into 'chunks'.

I've read and tried following the details at https://github.com/google/closure-compiler/wiki/JS-Modules and it works fine when I 'require' (commonJS style) a javascript file that is also part of the list of javascript files that I supply to the compiler (I've added --process_common_js_modules). However if I  try :

test.js:

import {awk} from 'test-awk/test';

/**
 *
 * @param {string} param
 */
export default function testSymbol(param) {
  console.log('This is a test from the test module - param: ', param);

  awk();
}

The compilation will fail with : 

project/web/js/modules/test.js:1: ERROR - Failed to load module "test-awk/test"
import {awk} from 'test-awk/test';

If I add test-awk/test.js to the list of files this works fine.

My problem is that I need to `import {Observable} from 'rxjs/RxJS';` - I cannot add the `node_modules/rxjs` tree to the list of files built with closure (there's code in there that closure doesn't like - including JSDoc annotations). I'm fine with needing to have an external bundler or similar to handle this code at runtime, but I need to import this ES6 module into code that in turn provides a typed interface to other code in my closure compiled app.

Am I missing something here? Or do I *have* to supply all the code to closure - even when using `import` etc.? 

Thanks

Andrew 8-)

[Tyler Breisacher]

The compiler is designed to compile all your code into a single binary. If you have code that you don't want compiled in, you can use an externs file to define the interface to that code, but we don't currently have a way to write an externs file for an ES6 module, so that imports of that module are left alone.

If the problem is just jsdoc that the compiler doesn't like, you could try the --hide_warnings_for=node_modules/rxjs flag.

--

---
You received this message because you are subscribed to the Google Groups "Closure Compiler Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to closure-compiler-d...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/closure-compiler-discuss/432a39a7-9b14-4039-ac94-36665871f666%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Andrew Kimpton]

On Friday, April 29, 2016 at 1:40:05 PM UTC-4, Tyler Breisacher wrote:

The compiler is designed to compile all your code into a single binary. If you have code that you don't want compiled in, you can use an externs file to define the interface to that code, but we don't currently have a way to write an externs file for an ES6 module, so that imports of that module are left alone.

Thanks for the quick response

 

I have some code that I do want compiled in - but that code needs to import an ES6 module.  If I give that code to the closure compiler it wants to resolve and handle the import itself. Is there a way to say 'ignore that import' so that it doesn't try and compile the code referenced in that import (and uses an extern for any types etc) ? It feels like if I write :

main.js:

goog.require('bar.doIt');

bar.doIt();

bar.js:

goog.provide('bar.doIt');

import {foo} from 'foo';

bar.doIt = function() {

  foo();

};

I have no choice but to provide 'foo.js' to the closure compiler - if I don't include foo.js in the --js list I get a 'failed to load' error.

I'm fine with writing an extern (if I have to) - but I just don't see a way to keep some code out of the closure compiler - whilst still at least importing the symbols from that module.

If the problem is just jsdoc that the compiler doesn't like, you could try the --hide_warnings_for=node_modules/rxjs flag.

I'll try this - it might actually work in this case, though there were a lot of errors, some might have been more egregious or difficult to ignore. Is there a '--ignore_errors_for' flag ? :-)

Andrew 8-)

[Tyler Breisacher]

> Is there a way to say 'ignore that import' so that it doesn't try and compile the code referenced in that import

No, that's what I'm saying. We don't have that currently (although we should, and probably will eventually).

--

---
You received this message because you are subscribed to the Google Groups "Closure Compiler Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to closure-compiler-d...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/closure-compiler-discuss/1e2d5691-8b1a-409b-a45e-15ec246df3de%40googlegroups.com.

[Chad Killingsworth]

I have a design document for this and plan on working it, but not before I handle a module name registry.

Chad Killingsworth

To unsubscribe from this group and stop receiving emails from it, send an email to closure-compiler-discuss+unsub...@googlegroups.com.

[Andrew Kimpton]

On Friday, April 29, 2016 at 3:18:02 PM UTC-4, Chad Killingsworth wrote:

I have a design document for this and plan on working it, but not before I handle a module name registry.

That would be great!

It feels at times (unfairly & simplistically) that the closure compiler is a bit like slime-mold, it oozes and creeps and wants to have an impact on everything that it sees. I appreciate the utility of having the compiler rewrite module related requires/imports so we don't need System.JS or WebPack or other bundlers/loaders. However one of the main benefits of the modules mechanisms is that it allows you to wall things off and keep them at arms length and operate with them through a defined interface. The fact that the compiler wants to apply its error checking and so forth to that code is annoying.

Is there a way for me to have per 'closure compiler modules' error flags? Could I put all the code into one closure module and then indicate that that module should be built with no optimizations and just transpiled & rewritten? 

Andrew 8-)

[Tyler Breisacher]

I think that's a fair (if disconcertingly stated) assessment. It was designed to be a full-program compiler, and of course it was designed long before ES6 modules were a thing. When ES6 came along we knew wanted to support it but that was, and continues to be, a lot of work, along with lots of other work we need to do (not all of which is visible outside of Google). I wish we could move faster sometimes :(

Anyway, being essentially a full-program compiler, it doesn't have a way to say "typecheck all my code, except this part" or "do advanced optimizations on all my code, except this part" or "leave this part of the code alone entirely" (other than the --hide_warnings_for flag, which just silences warnings, it doesn't affect the code output). Not that we couldn't add such things, just that they may take a while.

--

---
You received this message because you are subscribed to the Google Groups "Closure Compiler Discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to closure-compiler-d...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/closure-compiler-discuss/e4b3be00-b464-4553-a6d8-8dc38e7d201f%40googlegroups.com.

[Chad Killingsworth]

Are you using the --hide_warnings_for flag?

--

---
You received this message because you are subscribed to the Google Groups "Closure Compiler Discuss" group.

To unsubscribe from this group and stop receiving emails from it, send an email to closure-compiler-d...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/closure-compiler-discuss/e4b3be00-b464-4553-a6d8-8dc38e7d201f%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

Chad Killingsworth  | Banno | Senior Software Engineer
Jack Henry & Associates, Inc.

[Andrew Kimpton]

On Apr 29, 2016, at 3:41 PM, Chad Killingsworth <chad.kill...@banno.com> wrote:

Are you using the --hide_warnings_for flag?

Yep - I just tried turning that on and I now get : 

node_modules/rxjs-es/Observable.js:3: ERROR - Failed to load module "symbol-observable"

import * as $$observable from 'symbol-observable';

^

node_modules/rxjs-es/Rx.DOM.js:1: ERROR - ES6 transpilation of 'Wildcard export' is not yet implemented.

export * from './Rx';

^

node_modules/rxjs-es/Rx.KitchenSink.js:1: ERROR - ES6 transpilation of 'Wildcard export' is not yet implemented.

export * from './Rx';

^

node_modules/rxjs-es/Rx.js:131: ERROR - Failed to load module "symbol-observable"

import * as observable from 'symbol-observable';

^

node_modules/rxjs-es/observable/FromObservable.js:12: ERROR - Failed to load module "symbol-observable"

import * as $$observable from 'symbol-observable';

^

node_modules/rxjs-es/src/Rx.global.js:4: ERROR - Failed to load module "../dist/cjs/Rx"

    return require('../dist/cjs/Rx');

           ^

node_modules/rxjs-es/util/subscribeToResult.js:7: ERROR - Failed to load module "symbol-observable"

import * as $$observable from 'symbol-observable';

Which isn’t too bad - I suspect that my wildcard ‘node_modules/rxjs-es/**/*.js’ in my modules definition is pulling in far too much code (I think I can duck the files with ‘export *’). 

I’ll continue to push this around a bit and see what I get. It feels ‘closer’ now :-)

Andrew 8-)

You received this message because you are subscribed to a topic in the Google Groups "Closure Compiler Discuss" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/closure-compiler-discuss/OqTHnUxslmY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to closure-compiler-d...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/closure-compiler-discuss/CABwpjCvHXyp%2Bs3K05euJmLupV%2BWZQs71dD2eGq-BK2YVgfZ0Qg%40mail.gmail.com.

[Andrew Kimpton]

On Apr 29, 2016, at 3:49 PM, Andrew Kimpton <akim...@onshape.com> wrote:

On Apr 29, 2016, at 3:41 PM, Chad Killingsworth <chad.kill...@banno.com> wrote:

Are you using the --hide_warnings_for flag?

Yep - I just tried turning that on and I now get : 

node_modules/rxjs-es/Observable.js:3: ERROR - Failed to load module "symbol-observable"

import * as $$observable from 'symbol-observable';

^

Unfortunately this error is ‘blocking’ 8-( The ES6 installation of RxJS imports one other module using a relative path within the node_modules/rxjs-es folder - I can’t see a way to satisfy the relative path references by constructing a module that encompasses the code in such a way that the paths work correctly.  symbol-observable is imported ‘en-masse’ because other loaders would resolve this to node_modules/rxjs-ex/node_modules/symbol-observable/index.js) 

A simple test/repro set up for this is to follow the ES6 example on the RxJS github page : https://github.com/ReactiveX/rxjs Try the ‘middle’ option for ES 6: 

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';

Observable.of(1,2,3).map(x => x + '!!!'); // etc

I also tried switching to the CommonJS form of RsJS and then trying to rename the require in my code to an alternative name so that the closure compiler does not ‘follow’ the reference. That works to keep code from the closure compiler however I was unable to find a good way to get such an approach to work with SystemJS (which I would need in order to bundle the code for deployment).

So… I think I’ll have to switch to drawing a ‘hard line’ via a global reference and an extern between one part of my app and the code I write which interfaces with this module.

Andrew 8-)