auth0-blog / angular2-authentication-sample

This is a sample that shows how to add authentication to an Angular 2 (ng2) app
MIT License
966 stars 334 forks source link

Path error in tsc compiled js when exported sample files to other project. #61

Closed toni-moreno closed 8 years ago

toni-moreno commented 8 years ago

Hi , guys I need help with some basic Issues. But I'm turning crazy trying to look for the mistake.

I'm coding a collecting data tool with angular2 in the client side and golang on the server side.

https://github.com/toni-moreno/snmpcollector/tree/add_user_login

Then adding the ts files from this sample , tsc compiler works fine but when I start the server side I realized that the angular resources are not loading with complete path

it should be "/node_modules/angular2/... /*.js"

Instead of that I'm seeing that errors.

image

It seems that systemjs is not able to resolve paths now.

NOTE: before importing files from https://github.com/auth0-blog/angular2-authentication-sample I was testing a hello world and works fine you can see at the master branch (https://github.com/toni-moreno/snmpcollector/tree/master/public/app)

Any help will be appreciated

toni-moreno commented 8 years ago

I've tested changing the import paths. in main.ts, but tsc fails.


import { bootstrap}    from 'node_modules/angular2/platform/browser';
import { provide } from 'node_modules/angular2/core';
import { FORM_PROVIDERS } from 'node_modules/angular2/common';
import { ROUTER_PROVIDERS } from 'node_modules/angular2/router';
import { Http, HTTP_PROVIDERS } from 'node_modules/angular2/http';
import { AuthConfig, AuthHttp } from 'node_modules/angular2-jwt';
import { App } from './app/app';

Once changed I'm not able to compile ts files anymore.

[root@grafanalab01 snmpcollector]# npm run tsc

> snmpcollector@0.1.0 tsc /root/influxsnmp/src/github.com/toni-moreno/snmpcollector
> tsc

public/main.ts(1,29): error TS2307: Cannot find module '/node_modules/angular2/platform/browser'.
public/main.ts(2,25): error TS2307: Cannot find module '/node_modules/angular2/core'.
public/main.ts(3,32): error TS2307: Cannot find module '/node_modules/angular2/common'.
public/main.ts(4,34): error TS2307: Cannot find module '/node_modules/angular2/router'.
public/main.ts(5,38): error TS2307: Cannot find module '/node_modules/angular2/http'.
public/main.ts(6,38): error TS2307: Cannot find module '/node_modules/angular2-jwt'.

npm ERR! Linux 2.6.32-573.8.1.el6.x86_64
npm ERR! argv "/usr/local/bin/node" "/root/.npm-global/bin/npm" "run" "tsc"
npm ERR! node v5.10.1
npm ERR! npm  v3.8.6
npm ERR! code ELIFECYCLE
npm ERR! snmpcollector@0.1.0 tsc: `tsc`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the snmpcollector@0.1.0 tsc script 'tsc'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the snmpcollector package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     tsc
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs snmpcollector
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls snmpcollector
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /root/influxsnmp/src/github.com/toni-moreno/snmpcollector/npm-debug.log

How can I

toni-moreno commented 8 years ago

I've also changed the systemjs "mapping" path, now I load it from index.html in the following way

  System.config({
    defaultJSExtensions: true,
    map: {
       angular2: '/node_modules/angular2',
       'angular2-jwt': '/node_modules/angular2-jwt',
       rxjs:'/node_modules/rxjs'
    }
  });

Now compilation process it ok.

and resolution fails on runtime webapp load with angular2-jwt module.

image

What to do now?

toni-moreno commented 8 years ago

I'm finally configured sytemjs as folows

      System.config({
        defaultJSExtensions: true,
        map: {
           angular2: '/node_modules/angular2',
           'angular2-jwt': '/node_modules/angular2-jwt/angular2-jwt',
           rxjs:'/node_modules/rxjs'
        }
      });

Now all files seems to load all files ok, but "require" seems not to be defined.

image

toni-moreno commented 8 years ago

Finally fixed when removed all require functions add added on the @Component as URL resource.

Thx!