Unable to use the build version of tsc compile

Question

I am building the ts version of all files to one file and trying to use that. But it does not work with that. The normal one works. Here is the tsconfig:

 "compilerOptions": {
    "target": "ES5",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "declaration": true,
"outDir":"client/build/",
"outFile": "all.js"
  },

The html loads all.js and the system import.

<script src="client/build/all.js"></script>
<!-- 2. Configure SystemJS and Import -->
<script>
    System.config({
    packages: {        
      client: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
  System.import('client/build/all')
        .then(null, console.error.bind(console));
</script>

The build happens but unable to load into index.html file. What more is needed to get this working? Second is there a minify with tsc? Note: have checked Typescript compile to single file

Update

Just upgraded to Typescript 1.9dev and getting error:

[0] node_modules/angular2/src/facade/promise.d.ts(1,10): error TS2661: Cannot re-export name that is not defined in the module. [0] client/services/httpprovider.ts(13,5): error TS4053: Return type of public method from exported class has or is using name 'Observable' from external module "c:/git/projects/edureka/yeo/2/node_modules/rxjs/Observable" but cannot be named.

Update: Now on 1.82 stable version.

Update Update: Worked with bundles config definition (Check comments for Sasxa) - https://github.com/systemjs/systemjs/blob/master/docs/production-workflows.md

not sure what is happening, you get a 404 loading all.js ? is the file all.js there on the build folder ? Any errors on the console its better to post them here. Try Typescript 1.8 as it has the bundling feature and its a stable version -W https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript The one you installed 1.9.dev will likelly have all kind of traps as its an alpha version — Angular University, Feb 24 '16 at 10:16
No 404 error. I am able to load the file as well as the file is built right. But when I do System.import('client/build/all') it does not work. Getting a build error which does not occur when I compile normally without build into one file. — Gary, Feb 24 '16 at 10:19

score 2 · Accepted Answer · answered Feb 24 '16 at 11:03

2

You already loaded bundled files with:

<script src="client/build/all.js"></script>

You don't have to import them again with SystemJS.

// System.import('client/build/all')

Instead, you should import your bootstrap file:

System.import('client/bootstrap')

(or whatever name it's registered with in your bundle all.js...)

answered Feb 24 '16 at 11:03

Sasxa

40,334
16
88
102

Bootstrap is also in the same file. So would that be 'client/build/boot' or would that be just the register name boot? I am looking at this, but not much help https://github.com/systemjs/systemjs/blob/master/docs/production-workflows.md and when I do what you said it is not identifying my root component. says selector is missing. – Gary Feb 24 '16 at 11:27
Exception: The selector "main-app" did not match any elements – Gary Feb 24 '16 at 11:33
I believe it should be just `boot` if that's what it's registered as. I didn't work with bundles for a while, but i dug out this: `System.register("scripts/app/bootstrap.js", ["angular2/platform/browser.js", .....` from one of my old experiments. In this case I used `System.import('scripts/app/bootstrap')` to start the app... Docs are not very helpful, and guides/tutorials I've seen are very poor (or cover just basic boilerplate cases), so what little I managed to learn was trial and error ;/ I'm working on few apps without bundles, and hoping things will improve by the time I finish them (: – Sasxa Feb 24 '16 at 11:47
Thanks. I did try this and `System.register("services/userdetails",[...]` `System.register("boot",[...]` `System.register("services/httpreq",[...]` etc in the same `client/build/all.js'.` Will this work? .... `System.config({ packages: { client: { format: 'register', defaultExtension: 'js' } } }); System.import('boot').then(null, console.error.bind(console));` I am getting error for both `boot` and `client/build/boot` and `client/build/all/boot` :( – Gary Feb 24 '16 at 14:52
1

Can't be sure what's happening without trying and seeing the project. I suggest you create new project, with just 1-2 files and try to make that work first. When you figure what's going on and how things work upgrade your current project. I'm afraid I don't know a "quick fix" for this ;( – Sasxa Feb 24 '16 at 15:22
Ok, thanks worked with boot directly but had to use the bundles config. `System.config({ bundles: {'client/build/all.js': ['boot','components/main/main','components/register/register','components/login/login','components/approve/approve','components/candidates/candidates','components/results/results','components/admin/admin','components/vote/vote','components/getapproval/getapproval','components/users/users','components/home/home','services/userdetails','services/httpprovider','Any/Other/Module']} }); System.import('boot');` Did not have to add the file all.js to the script-html page. – Gary Feb 25 '16 at 07:05

score 0 · Answer 2 · answered Apr 11 '16 at 00:51

I just ran across this error after downloading a MVC Angular2 example solution from the web:

node_modules/angular2/src/facade/promise.d.ts(1,10): error TS2661: Cannot re-export name that is not defined in the module. [0]

The root cause was that the there was a bug in Angular. The solution: Run NPM Update on Angular2 folder within the project.

Unable to use the build version of tsc compile

2 Answers2