it breaks webpack compilation with angular 6 #128

phra · 2018-05-23T14:34:34Z

ISSUE UPDATE:

We (Stellar.org) found a fix, and it'll go live in the next release of stellar-base and stellar-sdk, either next Monday or the following one.

i'm not able to complete the migration from angular 5 to 6 of my web application because of stellar-base trying to import nodejs core modules.

steps to reproduce the issue:

cd /tmp
npx @angular/cli new project
cd project
yarn || npm i
yarn add stellar-sdk || npm i stellar-sdk

and update app.component.ts like this:

import { Component } from '@angular/core';
import { Transaction } from 'stellar-sdk';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';

  constructor() {
    console.log(Transaction);
  }
}

and then:

npx ng serve

ps: with angular v5 it works.

The text was updated successfully, but these errors were encountered:

phra · 2018-05-23T14:46:23Z

after debugging, i discover that the webpack configuration of the new angular is different in how it mocks nodejs core modules.

restoring the following snippet in ./node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js the compilation works again:

  "node": {
    "fs": "empty",
    "global": true,
    "crypto": "empty",
    "tls": "empty",
    "net": "empty",
    "process": true,
    "module": false,
    "clearImmediate": false,
    "setImmediate": false
  },

phra · 2018-05-23T15:13:31Z

see angular/devkit#967

phra · 2018-05-23T15:35:03Z

see angular/angular-cli#9827 (comment)

EDIT: the issue is caused by this line: https://github.com/stellar/js-stellar-base/blob/master/src/transaction.js#L10

bartekn · 2018-05-23T15:41:08Z

Strange move from Angular to remove shims for Node modules. I think we should be able to remove crypto dependency but it can be hard for eventsource polyfill. There are many possible fixes (including no-fix), let's think about the solutions.

Right now, can you try using bower-js-stellar-sdk in Angular context?

phra · 2018-05-23T16:05:07Z

@bartekn importing from stellar-sdk/dist/stellar-sdk seems to work as:

import { Transaction, Keypair, xdr, Network } from 'stellar-sdk/dist/stellar-sdk'

i can't test the application yet because there is another package that is breaking it, that is @ledgerhq/hw-app-str.

phra · 2018-05-25T14:34:35Z

@bartekn after debugging further, the solution was restoring the nodejs shims in the webpack configuration.. i will eventually test the bower build the next week but the optimal solution would be to remove any nodejs-specific dependency instead of relying on the webpack build: what if i want to use <script type="module"> in the browser?

mrtpain · 2018-06-03T07:53:07Z

@bartekn still having the same issue as @phra

Using the @types suggest in Add a .d.ts file so Typescript users can easily use this library as well. #132

Returns Module '"/Users/.../.../client/node_modules/@types/stellar-sdk/index"' has no default export warning so using import * as stellar from stellar-sdk was suggested returns the original "Can't resolve 'crypto' in ... error"

Ultimately trying to avoid overriding core angular files or using ng Eject for custom webpack config, a fix would be greatly appreciated.

Using Angular 6 and Typescript 2.7.2

phra · 2018-06-04T10:56:32Z

@mrtpain you have to manually patch your node_modules until a final fix is shipped. in order to make the compilation work again, you need to apply the changes described in angular/devkit#968 and continue to use the library just as before.. in order to completely fix this is not depending on Node.js builtin modules (that are not available in the browser without shims).

EDIT: in order to patch in a reproducible way your node_modules folder you can use https://github.com/maxchehab/quickfix

amitesh786 · 2018-10-26T15:25:08Z

Angular webpack issue - I have facing this error from 1 week - could anyone support me why this error comes in picture

Run

npm run webpack-dev-server --inline --progress --port 8080

Console Error


 10% building modules 3/3 modules 0 active
Project is running at http://localhost:8080/
webpack output is served from /
404s will fallback to /index.html
 10% building modules 7/10 modules 3 active ../src/main.ts
[at-loader] Using typescript@2.0.10 from typescript and "tsconfig.json" from ../src/tsconfig.json.

 **94% asset optimization
[at-loader] Checking started in a separate process...**

**[at-loader] Checking finished with 124 errors**
chunk    {0} vendor.js (vendor) 2.74 MB {2} [initial] [rendered]
chunk    {1} app.js (app) 12.1 kB {0} [initial] [rendered]
chunk    {2} polyfills.js (polyfills) 626 kB [entry] [rendered]

ERROR in [at-loader]./node_modules/@angular/common/src/location/platform_location.d.ts:47:59
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/common/src/pipes/async_pipe.d.ts:47:23
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:8:42
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:9:41
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:10:45
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:11:44
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/aot/compiler.d.ts:40:47
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/aot/compiler_host.d.ts:18:33
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/i18n/extractor.d.ts:14:33
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/i18n/extractor.d.ts:22:35
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/jit/compiler.d.ts:43:49
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/jit/compiler.d.ts:45:65
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/metadata_resolver.d.ts:71:104
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/resource_loader.d.ts:13:23
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/util.d.ts:2:36
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/util.d.ts:26:40
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/animation/animation_metadata_wrapped.d.ts:12:33
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/animation/dsl.d.ts:81:33
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/application_init.d.ts:21:27
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/application_ref.d.ts:116:76
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/application_ref.d.ts:132:110
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/application_ref.d.ts:162:67
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/application_ref.d.ts:164:101
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:9:33
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:10:43
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:11:42
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:12:43
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:13:35
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/linker/compiler.d.ts:43:49
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/linker/compiler.d.ts:51:65
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/linker/ng_module_factory_loader.d.ts:14:34
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/linker/system_js_ng_module_factory_loader.d.ts:28:25
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/render/api.d.ts:109:36
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/src/util/lang.d.ts:12:53
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/testing/src/before_each.d.ts:1:59
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/testing/src/component_fixture.d.ts:74:19
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/testing/src/component_fixture.d.ts:79:26
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/testing/src/test_bed.d.ts:85:33
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/core/testing/src/test_bed.d.ts:146:26
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/http/src/backends/browser_jsonp.d.ts:1:33
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/platform-browser-dynamic/src/resource_loader/resource_loader_impl.d.ts:10:23
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/platform-browser/src/dom/dom_renderer.d.ts:14:41
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/router/src/config.d.ts:309:85
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/interfaces.d.ts:78:99
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/interfaces.d.ts:157:109
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/interfaces.d.ts:229:162
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/interfaces.d.ts:299:89
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/interfaces.d.ts:367:50
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/router.d.ts:275:70
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/router.d.ts:297:59
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/router_module.d.ts:186:23
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@angular/router/src/shared.d.ts:15:37
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/router/src/utils/collection.d.ts:28:79
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:355:48
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:356:52
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:357:34
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:358:34
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:359:34
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:360:61
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:361:60
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:362:65
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:362:97
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:363:60
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:364:58
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:365:59
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:366:58
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:367:61
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:367:117
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:368:42
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:370:81
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:371:78
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:372:76
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:373:73
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:461:39
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:469:59
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:470:59
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:472:48
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:473:69
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:477:40
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:479:48
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:695:55
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:696:45
    TS2304: Cannot find name 'PropertyKey'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:829:20
    TS2304: Cannot find name 'PromiseConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:859:35
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1486:36
    TS2339: Property 'for' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1490:43
    TS2339: Property 'hasInstance' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1494:50
    TS2339: Property 'isConcatSpreadable' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1502:38
    TS2339: Property 'keyFor' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1506:37
    TS2339: Property 'match' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1510:39
    TS2339: Property 'replace' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1514:38
    TS2339: Property 'search' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1518:39
    TS2339: Property 'species' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1522:37
    TS2339: Property 'split' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1526:43
    TS2339: Property 'toPrimitive' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1530:43
    TS2339: Property 'toStringTag' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:1534:43
    TS2339: Property 'unscopables' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2305:36
    TS2339: Property 'for' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2309:43
    TS2339: Property 'hasInstance' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2313:50
    TS2339: Property 'isConcatSpreadable' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2321:38
    TS2339: Property 'keyFor' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2325:37
    TS2339: Property 'match' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2329:39
    TS2339: Property 'replace' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2333:38
    TS2339: Property 'search' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2337:39
    TS2339: Property 'species' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2341:37
    TS2339: Property 'split' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2345:43
    TS2339: Property 'toPrimitive' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2349:43
    TS2339: Property 'toStringTag' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/@types/core-js/index.d.ts:2353:43
    TS2339: Property 'unscopables' does not exist on type 'SymbolConstructor'.

ERROR in [at-loader] ./node_modules/rxjs/Observable.d.ts:68:60
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/rxjs/Observable.d.ts:68:70
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/rxjs/observable/PromiseObservable.d.ts:40:31
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/rxjs/observable/PromiseObservable.d.ts:41:26
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/rxjs/operator/toPromise.d.ts:2:60
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/rxjs/operator/toPromise.d.ts:3:79
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./node_modules/rxjs/operator/toPromise.d.ts:3:89
    TS2304: Cannot find name 'Promise'.

ERROR in [at-loader] ./src/app/app.component.ts:8:14
    TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

ERROR in [at-loader] ./src/app/app.module.ts:15:14
    TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

ERROR in [at-loader] ./src/app/components/container/container.component.spec.ts:5:34
    TS2307: Cannot find module '@angular/common/http'.

ERROR in [at-loader] ./src/app/components/container/container.component.ts:10:14
    TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

ERROR in [at-loader] ./src/app/components/header/header.component.ts:8:14
    TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

ERROR in [at-loader] ./src/app/services/ServiceAccordion.ts:1:28
    TS2307: Cannot find module '@angular/common/http'.

ERROR in [at-loader] ./src/app/services/ServiceAccordion.ts:6:14
    TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

ERROR in [at-loader] ./src/main.ts:7:43
    TS2339: Property 'ENV' does not exist on type 'ProcessEnv'.

ERROR in [at-loader] ./src/polyfills.ts:84:17
    TS2339: Property 'ENV' does not exist on type 'ProcessEnv'.
Child html-webpack-plugin for "index.html":
    chunk    {0} index.html 662 bytes [entry] [rendered]
webpack: Failed to compile.

Package.json/tsconfig.json

I have take from angular webpack https://v5.angular.io/guide/webpack

Please share if anyone resolve this issue awaiting...

`crypto` is a node built-in, so for browsers we have to add a polyfill for it (which breaks in Angular 6+). It's not needed, so factor it out. Part 1 of #128.

Only load `eventsource, which uses node built-ins `http` and `https`, in Node. Fixes an issue with Angular 6. See stellar/js-stellar-base#128.

morleyzhi · 2019-03-19T17:09:31Z

With the release of stellar-sdk 0.15.0 this issue should be fixed!

rafucisneros · 2019-07-27T18:54:07Z

I think this should be solved already, but im still getting error trying to import stellar-sdk into an Angular 8 Project. Dont know if this is the right place to ask about it, but I've tried stack overflow and cant get someone to answer and I really need to use it, so here its goes. Im getting the following error:

Error

ERROR in ./node_modules/eventsource/lib/eventsource.js 
Module not found: Error: Can't resolve 'http' in 'C:\Users\Rafael Cisneros\Desktop\Work\Ionic\example\node_modules\eventsource\lib' 
ERROR in ./node_modules/eventsource/lib/eventsource.js 
Module not found: Error: Can't resolve 'https' in 'C:\Users\Rafael Cisneros\Desktop\Work\Ionic\example\node_modules\eventsource\lib'

Code

Im just trying to use stellar in an Angular projetc. This is my app.component.ts:

import { Component } from '@angular/core';
import { Server } from 'stellar-sdk';

@component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'example';
  server: any;
  constructor(){
    this.server = new Server('https://horizon.stellar.org');
  }
}

Software versions

These are the versions in using:
Angular CLI: 8.1.2
Node: 10.16.0
OS: win32 x64
Angular: 8.1.3
-- stellar-sdk@2.1.1
-- stellar-base@1.0.3

abuiles · 2019-07-29T14:32:35Z

@rafucisneros could you create a simple boilerplate project with the error and push it somewhere on GitHub? That could would help us debug this issue more easily :)

rafucisneros · 2019-07-30T01:41:20Z

Tried to reproduce the problem with a brand new Angular 8 project and everything is just fine. I updated my ionic project to use Angular 8 (I realized it was using angular 7) and everything is working right. Sorry for the disturbance and thanks for the help!

rafucisneros · 2019-08-08T01:08:14Z

Hi! It's me again! Still trying to integrate Stellar with Ionic 4.
I can use "ionic serve" and everything works fine, but when I try to test the app with an android emulator using "ionic cordova run android" or "ionic cordova build android" I get the error:

ERROR in ./node_modules/eventsource/lib/eventsource.js
Module not found: Error: Can't resolve 'http' in 'C:\Users\Rafael Cisneros\Desktop\Work\Ionic\StellarTest\node_modules\eventsource\lib'                                                                                                         ERROR in ./node_modules/eventsource/lib/eventsource.js
Module not found: Error: Can't resolve 'https' in 'C:\Users\Rafael Cisneros\Desktop\Work\Ionic\StellarTest\node_modules\eventsource\lib'
[ERROR] An error occurred while running subprocess ng.

If I comment the line where I use stellar, build runs successfully:

this.server = new Server('https://horizon-testnet.stellar.org');

I pushed it into a repo:
https://github.com/rafucisneros/StellarTest

Not sure if its an issue you can solve, or if it is Ionic's team task.
Thanks for your help again!

amitesh786 · 2019-08-08T07:02:37Z

Tried to reproduce the problem with a brand new Angular 8 project and everything is just fine. I updated my ionic project to use Angular 8 (I realized it was using angular 7) and everything is working right. Sorry for the disturbance and thanks for the help!

I have created a project from scratch and trying to resolve your first issue related to eventsource but it's not working in angular 8 version.

ERROR in ./node_modules/eventsource/lib/eventsource.js

Software versions

Angular CLI: 8.1.0
Node: 10.16.0
OS: win32 x64
Angular: 8.0.2
stellar-sdk@2.2.1
stellar-base@1.1.1

rafucisneros · 2019-08-08T23:43:51Z

Tried to reproduce the problem with a brand new Angular 8 project and everything is just fine. I updated my ionic project to use Angular 8 (I realized it was using angular 7) and everything is working right. Sorry for the disturbance and thanks for the help!

I have created a project from scratch and trying to resolve your first issue related to eventsource but it's not working in angular 8 version.

ERROR in ./node_modules/eventsource/lib/eventsource.js

Software versions

Angular CLI: 8.1.0
Node: 10.16.0
OS: win32 x64
Angular: 8.0.2
stellar-sdk@2.2.1
stellar-base@1.1.1

I got no problem with Angular. I just created an app to test it. try updating everything.
There is the test: https://github.com/rafucisneros/ngStellarTest
My problem now is building android apk with Ionic 4.

rafucisneros · 2019-08-11T16:14:29Z

Tried to reproduce the problem with a brand new Angular 8 project and everything is just fine. I updated my ionic project to use Angular 8 (I realized it was using angular 7) and everything is working right. Sorry for the disturbance and thanks for the help!

I have created a project from scratch and trying to resolve your first issue related to eventsource but it's not working in angular 8 version.

ERROR in ./node_modules/eventsource/lib/eventsource.js

Software versions

Angular CLI: 8.1.0
Node: 10.16.0
OS: win32 x64
Angular: 8.0.2
stellar-sdk@2.2.1
stellar-base@1.1.1

You were right. Building doesnt work either with Angular. I had just tried ng serve which does work.

zzantares · 2019-09-25T19:35:19Z

Hi @rafucisneros @amitesh786, did you guys manage to solve the problem? perhaps a workaround? I'm currently facing the exact same problem 🤔 .

rafucisneros · 2019-09-25T19:41:14Z

Negative. I moved to React in which it does works.

amitesh786 · 2019-10-01T08:05:07Z

Hi @rafucisneros @amitesh786, did you guys manage to solve the problem? perhaps a workaround? I'm currently facing the exact same problem 🤔 .

Nope 😢 and I agree with @rafucisneros

vcarl · 2019-10-01T14:04:31Z

Please provide additional details if you're still seeing this, a minimal reproduction project would be helpful. This is a closed issue, without more information there's nothing anyone can do.

zzantares · 2019-10-03T14:27:34Z

Hi @vcarl, this is the minimal reproduction project.

This is how it was done:

$ ng new demo-project
$ npm install --save stellar-sdk

Then modify the app.component.ts file:

import { Component } from '@angular/core';
import { Server } from 'stellar-sdk';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
	title = 'demo-stellar';

	server: any;

	constructor() {
		this.server = new Server('https://horizon-testnet.stellar.org');
	}
}

And finally run the project yields the error:

❯ ng serve --watch                                                                                                                                          ✹

Date: 2019-10-03T14:09:43.673Z
Hash: 49e5f0df81e0c11a7ad4
Time: 10813ms
chunk {main} main.js, main.js.map (main) 10.6 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 248 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 16.3 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 5.11 MB [initial] [rendered]

ERROR in ./node_modules/eventsource/lib/eventsource.js
Module not found: Error: Can't resolve 'http' in '/Users/a/Documents/borrame/demo-stellar/node_modules/eventsource/lib'
ERROR in ./node_modules/eventsource/lib/eventsource.js
Module not found: Error: Can't resolve 'https' in '/Users/a/Documents/borrame/demo-stellar/node_modules/eventsource/lib'
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
ℹ ｢wdm｣: Failed to compile.

Angular version:

❯ ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 8.0.6
Node: 10.16.0
OS: darwin x64
Angular: 8.0.3
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.800.6
@angular-devkit/build-angular     0.800.6
@angular-devkit/build-optimizer   0.800.6
@angular-devkit/build-webpack     0.800.6
@angular-devkit/core              8.0.6
@angular-devkit/schematics        8.0.6
@angular/cli                      8.0.6
@ngtools/webpack                  8.0.6
@schematics/angular               8.0.6
@schematics/update                0.800.6
rxjs                              6.4.0
typescript                        3.4.5
webpack                           4.30.0

phra changed the title ~~it breaks with angular 6 compilation~~ it breaks webpack compilation with angular 6 May 23, 2018

phra mentioned this issue May 23, 2018

new webpack config is breaking 3rd party modules angular/devkit#967

Closed

phra mentioned this issue May 23, 2018

hw-app-str doesn't work with angular 6 LedgerHQ/ledgerjs#154

Closed

bartekn mentioned this issue May 29, 2018

Add a .d.ts file so Typescript users can easily use this library as well. stellar/js-stellar-sdk#132

Closed

morleyzhi self-assigned this Feb 27, 2019

morleyzhi mentioned this issue Feb 27, 2019

Remove the crypto library #169

Merged

morleyzhi closed this as completed in #169 Mar 1, 2019

morleyzhi added a commit that referenced this issue Mar 1, 2019

Remove the crypto library (#169)

1ffbb78

`crypto` is a node built-in, so for browsers we have to add a polyfill for it (which breaks in Angular 6+). It's not needed, so factor it out. Part 1 of #128.

morleyzhi reopened this Mar 1, 2019

morleyzhi mentioned this issue Mar 1, 2019

Replace the eventsource library stellar/js-stellar-sdk#239

Merged

morleyzhi added a commit to stellar/js-stellar-sdk that referenced this issue Mar 6, 2019

Replace the eventsource library (#239)

b1e9314

Only load `eventsource, which uses node built-ins `http` and `https`, in Node. Fixes an issue with Angular 6. See stellar/js-stellar-base#128.

asghaier76 mentioned this issue Mar 26, 2019

Error in kin-sdk types kinecosystem/kin.js#11

Closed

morleyzhi closed this as completed Apr 2, 2019

Ebioro mentioned this issue Apr 19, 2019

update stellar-base dependency chatch/stellar-hd-wallet#13

Closed

zzantares added a commit to zzantares/angular-stellar-issue-128 that referenced this issue Oct 3, 2019

Initial commit: stellar/js-stellar-base/issues/128

4fbaed7

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

it breaks webpack compilation with angular 6 #128

it breaks webpack compilation with angular 6 #128

phra commented May 23, 2018 •

edited by morleyzhi

Loading

phra commented May 23, 2018

phra commented May 23, 2018

phra commented May 23, 2018 •

edited

Loading

bartekn commented May 23, 2018

phra commented May 23, 2018 •

edited

Loading

phra commented May 25, 2018

mrtpain commented Jun 3, 2018

phra commented Jun 4, 2018 •

edited

Loading

amitesh786 commented Oct 26, 2018 •

edited

Loading

morleyzhi commented Mar 19, 2019

rafucisneros commented Jul 27, 2019 •

edited

Loading

abuiles commented Jul 29, 2019

rafucisneros commented Jul 30, 2019

rafucisneros commented Aug 8, 2019 •

edited

Loading

amitesh786 commented Aug 8, 2019

rafucisneros commented Aug 8, 2019

Software versions

rafucisneros commented Aug 11, 2019

Software versions

zzantares commented Sep 25, 2019

rafucisneros commented Sep 25, 2019

amitesh786 commented Oct 1, 2019

vcarl commented Oct 1, 2019

zzantares commented Oct 3, 2019

it breaks webpack compilation with angular 6 #128

it breaks webpack compilation with angular 6 #128

Comments

phra commented May 23, 2018 • edited by morleyzhi Loading

phra commented May 23, 2018

phra commented May 23, 2018

phra commented May 23, 2018 • edited Loading

bartekn commented May 23, 2018

phra commented May 23, 2018 • edited Loading

phra commented May 25, 2018

mrtpain commented Jun 3, 2018

phra commented Jun 4, 2018 • edited Loading

amitesh786 commented Oct 26, 2018 • edited Loading

Run

Console Error

Package.json/tsconfig.json

morleyzhi commented Mar 19, 2019

rafucisneros commented Jul 27, 2019 • edited Loading

Error

Code

Software versions

abuiles commented Jul 29, 2019

rafucisneros commented Jul 30, 2019

rafucisneros commented Aug 8, 2019 • edited Loading

amitesh786 commented Aug 8, 2019

Software versions

rafucisneros commented Aug 8, 2019

Software versions

rafucisneros commented Aug 11, 2019

Software versions

zzantares commented Sep 25, 2019

rafucisneros commented Sep 25, 2019

amitesh786 commented Oct 1, 2019

vcarl commented Oct 1, 2019

zzantares commented Oct 3, 2019

phra commented May 23, 2018 •

edited by morleyzhi

Loading

phra commented May 23, 2018 •

edited

Loading

phra commented May 23, 2018 •

edited

Loading

phra commented Jun 4, 2018 •

edited

Loading

amitesh786 commented Oct 26, 2018 •

edited

Loading

rafucisneros commented Jul 27, 2019 •

edited

Loading

rafucisneros commented Aug 8, 2019 •

edited

Loading