How to make SystemJS transpile 'typescript' based on file extension not contents

Question

I have this SystemJS config in index.html:

<body>
        <script src="node_modules/systemjs/dist/system.js"></script>
        <script>
            System.config({
                defaultJSExtensions: true,
                transpiler: 'typescript',
                map: {
                    typescript: 'node_modules/typescript/lib/typescript.js'
                },
                packages: {
                    "ts": {
                        "defaultExtension": "ts"
                    }
                },
            });
            System.import('ts/main');

        </script>
</body>

main.ts:

let a = [1, 2, 3];
let b = [1, 2, 3];

I get: Uncaught SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode. It looks like file is not transpiled by SystemJS.

When I add import statement in first line it works perfectly:

import * as ts from 'typescript'; // or any other package

let a = [1, 2, 3];
let b = [1, 2, 3];

It looks like SystemJS recognizes typescript file by "contents" - is this correct? If yes, how to force it to transpile every .ts or src/ file ?

Eduard Jacko · Accepted Answer · 2015-11-04 13:53:14Z

5

As you suspected, the systemjs guessing which syntax you are using in your file. You can help the systemjs by adding

// maybe you need to use " format:'register' " instead
System.config({
  meta: {
    '*.ts': {
      format: 'es6'
    }
  }
});

more info module-formats

edited Nov 4, 2015 at 13:53

answered Nov 2, 2015 at 23:34

Eduard Jacko

2,1611 gold badge19 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Yoorek Over a year ago

thx. i am aware of that option and t's useful for external libs but writing this for every file/class (>100) in an app does not makes sense (makes whole idea of dynamic loading irrelevant). specially when I know that in src/ dir are only .ts files producing es6 modules. I would like sth on package level not module like - System.config({ meta: { './src': { format: 'es6' } } }); OR extension level config - System.config({ meta: { '.ts': { format: 'es6' } } });

Eduard Jacko Over a year ago

you can use matching syntax if you need. './src/*.ts': { format: 'es6 }

Yoorek Over a year ago

I did not notice that - probably cliked by mistake while checking it as an answer. Sorry for that (IF that was me)

Rick Velde · Accepted Answer · 2016-12-20 22:54:22Z

0

I wrote a module to help out with handling multiple file extensions with SystemJS: https://www.npmjs.com/package/one-plugin

answered Dec 20, 2016 at 22:54

Rick Velde

5916 silver badges10 bronze badges

Collectives™ on Stack Overflow

How to make SystemJS transpile 'typescript' based on file extension not contents

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related