4

I want to use ES6 for my next project and I'm using Traceur as transpiler for the purpose. I got it working the way described in the Getting Started guide. However I would like to compile all my source files into single minified file in a way they describe it on the Compiling Offline page. But I cannot get it to work with multiple source files organized in a nested directory structure.

Here's a sample project to explain the problem. It has index.html in root folder and two .js files under src.

<project-root>
/index.html
/src/one.js
/src/two.js

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="traceur.js" type="text/javascript"></script>
  <script src="bootstrap.js" type="text/javascript"></script>
  <script type="module" src="src/two.js"></script>
  <script type="module">
    import Two from 'src/two.js';
    let t = new Two();
    console.log(t);
  </script>
  <title>Title</title>
</head>
<body>

</body>
</html>

src/one.js

export default class One {

  constructor() {
    console.log("One constructor");
  }

}

src/two.js

import One from 'src/one.js';

export default class Two extends One {
  constructor () {
    console.log("Two constructor");
    super();
  }
}

As I said, if I open index.html in browser, it will correctly work, printing the instance of Two to console.

But when I try to compile this offline, I get following error

PS D:\code\flattraceur> traceur.cmd src/two.js --out out\two.js
[Error: Error: ENOENT: no such file or directory, open 'D:\code\flattraceur\out\src\one.js'
Specified as src/one.js.
Imported by ../src/two.js.
Normalizes to src/one.js
locate resolved against base 'D:/code/flattraceur/out/'
]

As you can see, while compiling src/two.js, traceur looks for src/one.js under the output directory. I couldn't find any options on traceur that would let me customize the root of its search for referenced modules. I tried the --dir option too, but it fails too.

PS D:\code\flattraceur> traceur.cmd --dir src out

  Error: At least one input file is needed

Any suggestions?

Jayesh
  • 51,787
  • 22
  • 76
  • 99
  • 4
    Out of curiosity why not use babel? That's what I've seen used most nowadays. – m0meni Dec 15 '15 at 03:10
  • 2
    Babel endorsement - based on personal experience with both babel and traceur, babel is extremely easy to install and setup - and offers more ES6 features as of writing - https://kangax.github.io/compat-table/es6/ – arcseldon Dec 15 '15 at 11:19
  • Thanks for the suggestion. After some hiccups I managed to get things working with babel (with webpack). I'll leave this question around to increase awareness about traceur options in any case. – Jayesh Dec 15 '15 at 15:55

0 Answers0