0

I'm giving a try to Angular 2 RC4 compiler-cli to get project components compiled offline and I'm running into some problems in here.

Just for a notice, I am using directions that can be found in here: http://blog.mgechev.com/2016/06/26/tree-shaking-angular2-production-build-rollup-javascript/

So, my layout is that we're having here a several private npm packages which all have been exported for es5 target with es2015 version of that package nested in esm folder and jsnext:main tag in place that points to esm/core.js.

As that is done I'm building a project that is successfully loading those external modules and creates an application, that actually runs with no problems. In order to make it even better I'd like to apply all the techniques described in web post mentioned above.

In order to do all of that I've created a tsconfig file that sets target and module to es2015 and run:

node_modules/.bin/ngc -p .

And I'm doing this on linux build server.

Problem with all this setup is that for some reason some of components described in external packages cannot be properly parsed by ngc and I am getting:

Error: No Directive annotation found on *external component*

Error per each use of components located in core package.

So, can anyone point me to what's wrong with this setup and how can this be solved?

I would really like to see how bundle size would look like in final layout...

Also, I've noticed that some of examples use moduelId within @Component decorator but I've not seen any need for that, at least for now - could it be that that is a problem?

PS

If I ignore those errors and try to go on I see that all components which were including any of those external components producing errors, *.ngfactory.ts is generated as empty file.

PPS

Alternatively I could compile all the project from plain ts files. But then I run into a major problems on how to redirect all the references to my-local-core to some local folder with that package ts source files, as that module is already mapped to node-modules folder.

Improve this question

1 Answer 1

Reset to default
1

Answer to all this is that angular compiler-cli is still not in a state where it is capable to do offline compilation of anything bigger than hello world project. First of all there is a major source of misunderstanding with a way how template URL's are parsed as when angular components are deployed without pre-compilation those URL's will be taken as a global ones, deriving from web page URL. Although when it comes to pre compilation all URL's are taken as relative to component ts file - so if we use absolute URL's we don't have offline compiling but if we use relative URL's it won't work in non pre compiled mode. Secondly any component defined in external package just cannot be parsed to its pre compiled version as compiler-cli has no knowledge what to do with transpiled JavaScript version of it. And that holds true to different module formats including es2015. Thirdly ngc cannot parse custom decorators and functionality that works well within tsc brakes with "Error encountered resolving symbol values statically" as it encounters any instance of it.

Looking forward to RC 5 or most likely final release of Angular2.

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.