Create an extension for 'traceur'

cescoffier commented 10 years ago

Traceur is a JavaScript.next-to-JavaScript-of-today compiler that allows you to use features from the future today. Traceur's goal is to inform the design of new JavaScript features which are only valuable if they allow you to write better code. Traceur allows you to try out new and proposed language features today, helping you say what you mean in your code while informing the standards process.

Would be really nice to have a Watcher comping ES6 files with traceur. There is an NPM to compile the files: https://www.npmjs.org/package/traceur. So should not be an issue at all.

cescoffier commented 10 years ago

The extension is there: https://github.com/wisdom-framework/wisdom-traceur

k33g commented 10 years ago

Hello

i've try this (only js with traceur install with bower, v° 0.0.49): https://github.com/js-experiments/es6-project/tree/master/06-polymer-bb

it's ok

wisdom version: https://github.com/java-experiments/wisdom-traceur-bb-polymer

i've got an error, and "export" key word seems to generate error (ie: "export default Human;")

i need to test with grunt-traceur

On Tue, Jul 15, 2014 at 9:54 PM, Clement Escoffier <notifications@github.com

wrote:

The extension is there: https://github.com/wisdom-framework/wisdom-traceur

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49083736 .

cescoffier commented 10 years ago

Hi,

Many thanks for this feedback. I think I know from where come the error.

Right now we generate the ES5 code using:

traceur --out a.js --script a.js

But, this is probably wrong, we may not need the --script. In fact we don't know and can't really guess if the file we are compiling is a 'module' or a plain 'script'.

Thanks to your code we can investigate a but deeper. For instance detecting the 'export' keyword is a good sign of module.

The other question again about --script: do we need it at all ?

We will investigate this this morning, we keep you posted.

Cheers,

Clement

Sent from my iPhone

On 16 juil. 2014, at 00:20, Philippe CHARRIERE notifications@github.com wrote:

Hello

i've try this (only js with traceur install with bower, v° 0.0.49): https://github.com/js-experiments/es6-project/tree/master/06-polymer-bb

it's ok

wisdom version: https://github.com/java-experiments/wisdom-traceur-bb-polymer

i've got an error, and "export" key word seems to generate error (ie: "export default Human;")

i need to test with grunt-traceur

On Tue, Jul 15, 2014 at 9:54 PM, Clement Escoffier <notifications@github.com

wrote:

The extension is there: https://github.com/wisdom-framework/wisdom-traceur

— Reply to this email directly or view it on GitHub < https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49083736>

.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49100836 .

k33g commented 10 years ago

Hello it's probably about module: (i'm not sure, i can't run my code with grunt-traceur and export seems to be the problem) I'll will try with gulp and broccoli

there is an option perhaps:

traceur --out app-build.js app/app --modules=instantiate

have a nice day Philippe

On Wed, Jul 16, 2014 at 7:39 AM, Clement Escoffier <notifications@github.com

wrote:

Hi,

Many thanks for this feedback. I think I know from where come the error.

Right now we generate the ES5 code using:

traceur --out a.js --script a.js

But, this is probably wrong, we may not need the --script. In fact we don't know and can't really guess if the file we are compiling is a 'module' or a plain 'script'.

Thanks to your code we can investigate a but deeper. For instance detecting the 'export' keyword is a good sign of module.

The other question again about --script: do we need it at all ?

We will investigate this this morning, we keep you posted.

Cheers,

Clement

Sent from my iPhone

On 16 juil. 2014, at 00:20, Philippe CHARRIERE notifications@github.com wrote:

Hello

i've try this (only js with traceur install with bower, v° 0.0.49): https://github.com/js-experiments/es6-project/tree/master/06-polymer-bb

it's ok

wisdom version: https://github.com/java-experiments/wisdom-traceur-bb-polymer

i've got an error, and "export" key word seems to generate error (ie: "export default Human;")

i need to test with grunt-traceur

On Tue, Jul 15, 2014 at 9:54 PM, Clement Escoffier < notifications@github.com

wrote:

The extension is there: https://github.com/wisdom-framework/wisdom-traceur

— Reply to this email directly or view it on GitHub < https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49083736>

.

— Reply to this email directly or view it on GitHub < https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49100836>

.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49125544 .

k33g commented 10 years ago

--module=inline should be better

On Wed, Jul 16, 2014 at 7:43 AM, Philippe Charrière ph.charriere@gmail.com wrote:

Hello it's probably about module: (i'm not sure, i can't run my code with grunt-traceur and export seems to be the problem) I'll will try with gulp and broccoli

there is an option perhaps:

traceur --out app-build.js app/app --modules=instantiate

have a nice day Philippe

On Wed, Jul 16, 2014 at 7:39 AM, Clement Escoffier < notifications@github.com> wrote:

Hi,

Many thanks for this feedback. I think I know from where come the error.

Right now we generate the ES5 code using:

traceur --out a.js --script a.js

But, this is probably wrong, we may not need the --script. In fact we don't know and can't really guess if the file we are compiling is a 'module' or a plain 'script'.

Thanks to your code we can investigate a but deeper. For instance detecting the 'export' keyword is a good sign of module.

The other question again about --script: do we need it at all ?

We will investigate this this morning, we keep you posted.

Cheers,

Clement

Sent from my iPhone

On 16 juil. 2014, at 00:20, Philippe CHARRIERE notifications@github.com

wrote:

Hello

i've try this (only js with traceur install with bower, v° 0.0.49): https://github.com/js-experiments/es6-project/tree/master/06-polymer-bb

it's ok

wisdom version: https://github.com/java-experiments/wisdom-traceur-bb-polymer

i've got an error, and "export" key word seems to generate error (ie: "export default Human;")

i need to test with grunt-traceur

On Tue, Jul 15, 2014 at 9:54 PM, Clement Escoffier < notifications@github.com

wrote:

The extension is there: https://github.com/wisdom-framework/wisdom-traceur

— Reply to this email directly or view it on GitHub <

https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49083736>

.

— Reply to this email directly or view it on GitHub < https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49100836>

.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49125544 .

cescoffier commented 10 years ago

By the way, do you need the 'experimental' feature ? There is a flag to enable them...

k33g commented 10 years ago

yes I think it's useful

On Wed, Jul 16, 2014 at 8:19 AM, Clement Escoffier <notifications@github.com

wrote:

By the way, do you need the 'experimental' feature ? There is a flag to enable them...

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49127657 .

cescoffier commented 10 years ago

Do you have any working example of module using Traceur ? I can't find any example (on http://www.es6fiddle.net/)

cescoffier commented 10 years ago

Got it... To work with module the command line is really different:

traceur --dir in out

Unfortunately, this breaks all non-module files (ES5 and ES6). So we need to add a 'module' parameter indicating the directory containing the modules. Other files are compiled using the regular command.

k33g commented 10 years ago

my example works with traceur (gulp-traceur) + module="instantiate", but I've to keep dependencies to traceur (not the run time, es6-loader and system.js) ... bof!

module="inline" generate an error, i'm going to try "à la main"

On Wed, Jul 16, 2014 at 9:41 AM, Clement Escoffier <notifications@github.com

wrote:

Do you have any working example of module using Traceur ? I can't find any example (on http://www.es6fiddle.net/)

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49133283 .

k33g commented 10 years ago

i've found something, stay tuned

On Wed, Jul 16, 2014 at 10:00 AM, Clement Escoffier < notifications@github.com> wrote:

Got it... To work with module the command line is really different:

traceur --dir in out

Unfortunately, this breaks all non-module files (ES5 and ES6). So we need to add a 'module' parameter indicating the directory containing the modules. Other files are compiled using the regular command.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49134826 .

k33g commented 10 years ago

this works

traceur --out public/js/app/app-build.js public/js/app/_.js public/js/app/_/.js --modules=inline

it bundles a single file with all modules

After you need:

And it's ok

my work here : https://github.com/walking-skeletons/es6-traceur-from-scratch

On Wed, Jul 16, 2014 at 10:00 AM, Clement Escoffier < notifications@github.com> wrote:

Got it... To work with module the command line is really different:

traceur --dir in out

Unfortunately, this breaks all non-module files (ES5 and ES6). So we need to add a 'module' parameter indicating the directory containing the modules. Other files are compiled using the regular command.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49134826 .

k33g commented 10 years ago

additional informations: https://github.com/ModuleLoader/es6-module-loader#moving-to-production

On Wed, Jul 16, 2014 at 11:29 AM, Philippe Charrière <ph.charriere@gmail.com

wrote:

this works

traceur --out public/js/app/app-build.js public/js/app/_.js public/js/app/_/.js --modules=inline

it bundles a single file with all modules

After you need:

And it's ok

my work here : https://github.com/walking-skeletons/es6-traceur-from-scratch

On Wed, Jul 16, 2014 at 10:00 AM, Clement Escoffier < notifications@github.com> wrote:

Got it... To work with module the command line is really different:

traceur --dir in out

Unfortunately, this breaks all non-module files (ES5 and ES6). So we need to add a 'module' parameter indicating the directory containing the modules. Other files are compiled using the regular command.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49134826 .

cescoffier commented 10 years ago

Did you make progress ?

I'm concerned by breaking ES5 (regular JavaScript) code. For instance, when I use --dir, it compiles all files, even files that are not ES6, and it changes the semantic of the code. We definitely need a selection/filtering feature to distinguish the ES6 and ES5 code.

k33g commented 10 years ago

the only way I've found is that my ES6 files aren't in the same location of ES5 files (ie: bower libraries aren't transpiled)

yesterday i'll try this workflow with a gulp task: https://github.com/walking-skeletons/es6-traceur-modules-gulp/blob/master/gulpfile.js

it works fine (I'm using 'inline' option, but i'm going to try with --dir)

On Thu, Jul 17, 2014 at 7:38 AM, Clement Escoffier <notifications@github.com

wrote:

Did you make progress ?

I'm concerned by breaking ES5 (regular JavaScript) code. For instance, when I use --dir, it compiles all files, even files that are not ES6, and it changes the semantic of the code. We definitely need a selection/filtering feature to distinguish the ES6 and ES5 code.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49260308 .

k33g commented 10 years ago

I think the only way is to separate location of ES6 files and ES5 files

We can change options of traceur because:

the --dir solution runs well and I've to do that in my html page:

the --out <*.js> --modules=inline solution runs well and I've to do that in my html page:

But be careful, when I use Polymer component with the first way the html file of component is not moved

with the second way my component is like that:

and Polymer find the good module in the module

with the first way i've had to add the path to the script (and it fails for the moment)

On Thu, Jul 17, 2014 at 8:05 AM, Philippe Charrière ph.charriere@gmail.com wrote:

the only way I've found is that my ES6 files aren't in the same location of ES5 files (ie: bower libraries aren't transpiled)

yesterday i'll try this workflow with a gulp task:

https://github.com/walking-skeletons/es6-traceur-modules-gulp/blob/master/gulpfile.js

it works fine (I'm using 'inline' option, but i'm going to try with --dir)

On Thu, Jul 17, 2014 at 7:38 AM, Clement Escoffier < notifications@github.com> wrote:

Did you make progress ?

I'm concerned by breaking ES5 (regular JavaScript) code. For instance, when I use --dir, it compiles all files, even files that are not ES6, and it changes the semantic of the code. We definitely need a selection/filtering feature to distinguish the ES6 and ES5 code.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49260308 .

k33g commented 10 years ago

oups, i was wrong for a lot of things (sorry)

with the 'inline' way, I've just to use traceur run-time and it's ok for all:

with the 'dir' way, I even don't know how to load my files

On Thu, Jul 17, 2014 at 8:40 AM, Philippe Charrière ph.charriere@gmail.com wrote:

I think the only way is to separate location of ES6 files and ES5 files

We can change options of traceur because:

the --dir solution runs well and I've to do that in my html page:

<script src="bower_components/traceur-runtime/traceur-runtime.js"> <script src="bower_components/es6-module-loader/dist/es6-module-loader.min.js"> <script src="bower_components/system.js/dist/system-production-csp.min.js">

the --out <*.js> --modules=inline solution runs well and I've to do that in my html page:

<script src="bower_components/traceur-runtime/traceur-runtime.js"> <script src="bower_components/es6-module-loader/dist/es6-module-loader.min.js"> <script src="bower_components/system.js/dist/system-production-csp.min.js">

But be careful, when I use Polymer component with the first way the html file of component is not moved

with the second way my component is like that:

and Polymer find the good module in the module

with the first way i've had to add the path to the script (and it fails for the moment)

On Thu, Jul 17, 2014 at 8:05 AM, Philippe Charrière < ph.charriere@gmail.com> wrote:

the only way I've found is that my ES6 files aren't in the same location of ES5 files (ie: bower libraries aren't transpiled)

yesterday i'll try this workflow with a gulp task:

https://github.com/walking-skeletons/es6-traceur-modules-gulp/blob/master/gulpfile.js

it works fine (I'm using 'inline' option, but i'm going to try with --dir)

On Thu, Jul 17, 2014 at 7:38 AM, Clement Escoffier < notifications@github.com> wrote:

Did you make progress ?

I'm concerned by breaking ES5 (regular JavaScript) code. For instance, when I use --dir, it compiles all files, even files that are not ES6, and it changes the semantic of the code. We definitely need a selection/filtering feature to distinguish the ES6 and ES5 code.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49260308 .

k33g commented 10 years ago

my english is creepy, but you can test my workflow here: https://github.com/walking-skeletons/es6-traceur-modules-gulp

if I can run traceur like that from wisdom, I can test something if you want traceur --out public/js/app/app-build.js public/js/app/_.js public/js/app/_/.js --modules=inline

On Thu, Jul 17, 2014 at 8:50 AM, Philippe Charrière ph.charriere@gmail.com wrote:

oups, i was wrong for a lot of things (sorry)

with the 'inline' way, I've just to use traceur run-time and it's ok for all:

with the 'dir' way, I even don't know how to load my files

On Thu, Jul 17, 2014 at 8:40 AM, Philippe Charrière < ph.charriere@gmail.com> wrote:

I think the only way is to separate location of ES6 files and ES5 files

We can change options of traceur because:

the --dir solution runs well and I've to do that in my html page:

<script src="bower_components/traceur-runtime/traceur-runtime.js"> <script src="bower_components/es6-module-loader/dist/es6-module-loader.min.js"> <script src="bower_components/system.js/dist/system-production-csp.min.js">

the --out <*.js> --modules=inline solution runs well and I've to do that in my html page:

<script src="bower_components/traceur-runtime/traceur-runtime.js"> <script src="bower_components/es6-module-loader/dist/es6-module-loader.min.js"> <script src="bower_components/system.js/dist/system-production-csp.min.js">

But be careful, when I use Polymer component with the first way the html file of component is not moved

with the second way my component is like that:

and Polymer find the good module in the module

with the first way i've had to add the path to the script (and it fails for the moment)

On Thu, Jul 17, 2014 at 8:05 AM, Philippe Charrière < ph.charriere@gmail.com> wrote:

the only way I've found is that my ES6 files aren't in the same location of ES5 files (ie: bower libraries aren't transpiled)

yesterday i'll try this workflow with a gulp task:

https://github.com/walking-skeletons/es6-traceur-modules-gulp/blob/master/gulpfile.js

it works fine (I'm using 'inline' option, but i'm going to try with --dir)

On Thu, Jul 17, 2014 at 7:38 AM, Clement Escoffier < notifications@github.com> wrote:

Did you make progress ?

I'm concerned by breaking ES5 (regular JavaScript) code. For instance, when I use --dir, it compiles all files, even files that are not ES6, and it changes the semantic of the code. We definitely need a selection/filtering feature to distinguish the ES6 and ES5 code.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49260308 .

cescoffier commented 10 years ago

@jenf11 is going to modify the extension to get that working.

We have identified a couple of parameters:

experimental : enables / disables the experimental feature (true by default)
includes : select the ES6 file to compile (by default **/*.es6.js)
output : the output file (by default artifactId.js)
moduleStrategy : the module strategy (includes by default)

k33g commented 10 years ago

I hope my weekend will be rainy ;)

On Thu, Jul 17, 2014 at 10:12 AM, Clement Escoffier < notifications@github.com> wrote:

@jenf11 https://github.com/jenf11 is going to modify the extension to get that working.

We have identified a couple of parameters:

experimental : enables / disables the experimental feature (true by default)

includes : select the ES6 file to compile (by default */.es6.js)

output : the output file (by default artifactId.js)

moduleStrategy : the module strategy (includes by default)

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49271045 .

cescoffier commented 10 years ago

Hi @k33g

I've a really good news for you. The version we just pushed with @jenf11 is actually working. We have migrated https://github.com/walking-skeletons/es6-traceur-modules-gulp to Wisdom and it's working like a charm.

The plugin requires your ES6 files to be named .es6.js. Don't worry it does not change anything (especially on module import), as we drop the .es6 suffix while processing the files.

By default the plugin use --module inlines and `--experimental``.

Let us know.

k33g commented 10 years ago

wow! I go home to try quietly :))

On Thu, Jul 17, 2014 at 4:28 PM, Clement Escoffier <notifications@github.com

wrote:

Hi @k33g https://github.com/k33g

I've a really good news for you. The version we just pushed with @jenf11 https://github.com/jenf11 is actually working. We have migrated https://github.com/walking-skeletons/es6-traceur-modules-gulp to Wisdom and it's working like a charm.

The plugin requires your ES6 files to be named .es6.js. Don't worry it does not change anything (especially on module import), as we drop the .es6 suffix while processing the files.

By default the plugin use --module inlines and --experimental`.

Let us know.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49313965 .

k33g commented 10 years ago

@clement

I'm definitively a newbie with Maven i think my project is using the old version of plugin any idea?

On Thu, Jul 17, 2014 at 5:05 PM, Philippe Charrière ph.charriere@gmail.com wrote:

wow! I go home to try quietly :))

On Thu, Jul 17, 2014 at 4:28 PM, Clement Escoffier < notifications@github.com> wrote:

Hi @k33g https://github.com/k33g

I've a really good news for you. The version we just pushed with @jenf11 https://github.com/jenf11 is actually working. We have migrated https://github.com/walking-skeletons/es6-traceur-modules-gulp to Wisdom and it's working like a charm.

The plugin requires your ES6 files to be named .es6.js. Don't worry it does not change anything (especially on module import), as we drop the .es6 suffix while processing the files.

By default the plugin use --module inlines and --experimental`.

Let us know.

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49313965 .

cescoffier commented 10 years ago

My bad, it was not redeploy on the repository (need to check the jenkins settings).

I just redeployed it. Try with the -U option (update):

mvn lean wisdom:run -U

k33g commented 10 years ago

it's ok, ant it works fine :) thx

On Thu, Jul 17, 2014 at 7:56 PM, Clement Escoffier <notifications@github.com

wrote:

My bad, it was not redeploy on the repository (need to check the jenkins settings).

I just redeployed it. Try with the -U option (update):

mvn lean wisdom:run -U

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49341250 .

cescoffier commented 10 years ago

Yet another version that does not require the .es6.js extension. Files to be compiled need to either:

contain a //!ES6 comment (or //!EcmaScript6)
being listed in the includes parameter of the plugin

In the first case, it would be something like:

//!EcmaScript6
class Application {

  constructor () {
    $("h1").html("ES6 rocks!!! by @k33g_org");
  }
}
$(() => {
  new Application();
});

In the second case, the configuration would look like:

<plugin>
    <groupId>org.wisdom-framework</groupId>
    <artifactId>wisdom-traceur-maven-plugin</artifactId>
    <version>1.0-SNAPSHOT</version>
    <executions>
        <execution>
            <goals>
                <goal>compile-es6</goal>
            </goals>
        </execution>
    </executions>
    <configuration>
        <includes>
            <include>human*.js</include>
            <include>my-title.js</include>
        </includes>
    </configuration>
</plugin>

Obviously, both way can be used at the same time.

k33g commented 10 years ago

:+1: I've just tested \o/

cescoffier commented 10 years ago

Can we consider this issue as closed ?

k33g commented 10 years ago

oh yes! :)

On Sat, Jul 19, 2014 at 9:15 AM, Clement Escoffier <notifications@github.com

wrote:

Can we considered this issue as closed ?

— Reply to this email directly or view it on GitHub https://github.com/wisdom-framework/wisdom/issues/273#issuecomment-49501999 .

wisdom-framework / wisdom

Create an extension for 'traceur' #273