preboot / angular-webpack

A complete, yet simple, starter for Angular v2+ using webpack
MIT License
1.29k stars 556 forks source link

After adding global typings I can't built project, typings does not seem to register. #323

Open dewwwald opened 7 years ago

dewwwald commented 7 years ago

What I did:

1) Added mixpanel as an analytics tool. 2) Add a file app-typings/app.d.ts

declare let API_URL: string;

declare interface People {
  set(personProperties: any): null;
}
declare interface Mixpanel {
  identify(personId: string): null;
  track(eventName: string, eventProperties: any): null;
  people: People;
}

declare let mixpanel: Mixpanel;

3) install typings ^2.1.0 (the other files are empty

{
  "globalDependencies": {
    "app": "file:./app-typings/app.d.ts",
    "index": "file:./app-typings/index.d.ts",
    "polyfills": "file:./app-typings/polyfills.d.ts",
    "vendor": "file:./app-typings/vendor.d.ts"
  }
}

4) amend start script in package.json =>

{...
  "start": "typings install --global --save file:./app-typings/app.d.ts && npm run server",
...}

5) add compiler option in tsconfig.json "noImplicitAny": true

6) Use mixpanel by setting it to a variable. In the constructor of the component.

There is like 3 bug blocks but this is the first after the jargon: ReferenceError: mixpanel is not defined at new AnalyticsService (eval at (http://localhost:8080/js/app.js:480:1), :13:46) at AppModuleInjector.get (/AppModule/module.ngfactory.js:394:77) at AppModuleInjector.getInternal (/AppModule/module.ngfactory.js:498:56) at AppModuleInjector.NgModuleInjector.get (eval at (http://localhost:8080/js/vendor.js:1640:1), :155:44) at CompiledTemplate.proxyViewClass.AppView.injectorGet (eval at (http://localhost:8080/js/vendor.js:2596:1), :165:45) at CompiledTemplate.proxyViewClass.DebugAppView.injectorGet (eval at (http://localhost:8080/js/vendor.js:2596:1), :584:49) at CompiledTemplate.proxyViewClass.View_AppComponent0.createInternal (/AppModule/AppComponent/component.ngfactory.js:26:83) at CompiledTemplate.proxyViewClass.AppView.create (eval at (http://localhost:8080/js/vendor.js:2596:1), :108:21) at CompiledTemplate.proxyViewClass.DebugAppView.create (eval at (http://localhost:8080/js/vendor.js:2596:1), :551:44) at CompiledTemplate.proxyViewClass.View_AppComponentHost0.createInternal (/AppModule/AppComponent/host.ngfactory.js:16:19) at CompiledTemplate.proxyViewClass.AppView.createHostView (eval at (http://localhost:8080/js/vendor.js:2596:1), :121:21) at CompiledTemplate.proxyViewClass.DebugAppView.createHostView (eval at (http://localhost:8080/js/vendor.js:2596:1), :568:52) at ComponentFactory.create (eval at (http://localhost:8080/js/vendor.js:1070:1), :232:25) at ApplicationRef.bootstrap (eval at (http://localhost:8080/js/vendor.js:1014:1), :613:57) at eval (eval at (http://localhost:8080/js/vendor.js:1014:1), :425:89) at Array.forEach (native) at PlatformRef_._moduleDoBootstrap (eval at (http://localhost:8080/js/vendor.js:1014:1), :425:42) at eval (eval at (http://localhost:8080/js/vendor.js:1014:1), :377:27) at ZoneDelegate.invoke (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :242:26) at Object.onInvoke (eval at (http://localhost:8080/js/vendor.js:1119:1), :271:37) at ZoneDelegate.invoke (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :241:32) at Zone.run (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :113:43) at eval (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :520:57) at ZoneDelegate.invokeTask (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :275:35) at Object.onInvokeTask (eval at (http://localhost:8080/js/vendor.js:1119:1), :262:37) at ZoneDelegate.invokeTask (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :274:40) at Zone.runTask (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :151:47) at drainMicroTaskQueue (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :418:35) at HTMLDocument.ZoneTask.invoke (eval at 938 (http://localhost:8080/js/polyfills.js:795:1), :349:25)

dewwwald commented 7 years ago

Here is an update. Adding var mixpanel = undefined; to the html in head fixes the problem. How can I solve this in a clean way?