search

wishtack / wishtack-steroids

Frontend on Steroids: Reactive Component Loader, RxJS Scavenger...
https://wishtack.io
MIT License
96 stars 16 forks source link

Problem when compiling project with ECMAScript 2018 #173

Closed jbx-jhidalgo closed 5 years ago

jbx-jhidalgo commented 5 years ago

I have a problem compiling my project. The console throws several errors among which are the following: "Uncaught TypeError: Cannot read property 'meteorInstall' of undefined", "Uncaught TypeError: Cannot read property 'Base64' of undefined", "Uncaught TypeError: Cannot read property 'EJSON' of undefined" .....

I think it may be because of the configuration of the tscongig.json. I am using the ECMAScript version 'es2018' but if I change it to 'es2015' it works. My tsconfig.josn is the following:

`{

"compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "declaration": false,
    "emitDecoratorMetadata": true,
    "importHelpers": true,
    "experimentalDecorators": true,
    "lib": [
        "es2018",
        "dom"
    ],
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "target": "es5",
    "skipLibCheck": true,
    "stripInternal": true,
    "noImplicitAny": false,
    "typeRoots": [
        "node_modules/@types"
    ]
},
"include": [
    "imports/**/*.ts",
    "client/**/*.ts",
    "server/**/*.ts"
],
"exclude": [
    "node_modules",
    ".meteor/local"
],
"compileOnSave": false,
"angularCompilerOptions": {
    "genDir": "aot",
    "skipMetadataEmit": true,
    "enableIvy": true
},
"atom": {
    "rewriteTsconfig": false
}

}`

Is there incompatibility with the ECMAscript 2018 version?

Could you help me with this problem?

yjaaidi commented 5 years ago

Hi @jbx-jhidalgo , Oh! Sorry for the inconvenience. Can you please tell me which package you are using because as you might have noticed here https://github.com/wishtack/wishtack-steroids, this is a monorepo with 6 different packages. Thank you in advance.

jbx-jhidalgo commented 5 years ago

Sorry! I'm using reactive-component-loader package

yjaaidi commented 5 years ago

This is really weird. Are you sure it's related to reactive-component-loader? Because the errors seem to come from other places like meteorInstall

jbx-jhidalgo commented 5 years ago

I am using MeteorCLI as in the following example https://github.com/Urigo/angular-meteor/tree/master/examples/MeteorCLI/all-in-one

I'm not sure where the problem comes from, but the error I get after importing ReativeComponentLoaderModule.forRoot () in app.modules.ts. If I comment this line does not give the error. imports: [ ReactiveComponentLoaderModule.forRoot (), .... ]

yjaaidi commented 5 years ago

Wow! This sounds like a tricky issue 😅

Could you please share the whole terminal output? I guess, it's not easy to reproduce somewhere shareable like stackblitz?

On Wed, Mar 13, 2019 at 1:48 PM JC notifications@github.com wrote:

I am using MeteorCLI as in the following example https://github.com/Urigo/angular-meteor/tree/master/examples/MeteorCLI/all-in-one

I'm not sure where the problem comes from, but the error I get after importing ReativeComponentLoaderModule.forRoot () in app.modules.ts. If I comment this line does not give the error. imports: [ ReactiveComponentLoaderModule.forRoot (), .... ]

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/wishtack/wishtack-steroids/issues/173#issuecomment-472407912, or mute the thread https://github.com/notifications/unsubscribe-auth/ACjP4p55P3enZeEgOt3X-piN-zEtrTvKks5vWPOQgaJpZM4bs3jd .

jbx-jhidalgo commented 5 years ago

Yes, it is a strange error. Sorry, I can not play the code in stackblitz or similar. This is part of the console output:

babel-runtime.js?hash=134c95e906ec8740d8437618b59f7dfc1170c9ac:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at babel-runtime.js?hash=134c95e906ec8740d8437618b59f7dfc1170c9ac:17 at babel-runtime.js?hash=134c95e906ec8740d8437618b59f7dfc1170c9ac:155 (anonymous) @ babel-runtime.js?hash=134c95e906ec8740d8437618b59f7dfc1170c9ac:17 (anonymous) @ babel-runtime.js?hash=134c95e906ec8740d8437618b59f7dfc1170c9ac:155 promise.js?hash=c4530b4991a1ee60c1ba4dca3fd9d4e8acfff78d:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at promise.js?hash=c4530b4991a1ee60c1ba4dca3fd9d4e8acfff78d:17 at promise.js?hash=c4530b4991a1ee60c1ba4dca3fd9d4e8acfff78d:164 (anonymous) @ promise.js?hash=c4530b4991a1ee60c1ba4dca3fd9d4e8acfff78d:17 (anonymous) @ promise.js?hash=c4530b4991a1ee60c1ba4dca3fd9d4e8acfff78d:164 fetch.js?hash=605b22f305af6e9c048c3ce8418e326530eff2f3:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at fetch.js?hash=605b22f305af6e9c048c3ce8418e326530eff2f3:17 at fetch.js?hash=605b22f305af6e9c048c3ce8418e326530eff2f3:52 (anonymous) @ fetch.js?hash=605b22f305af6e9c048c3ce8418e326530eff2f3:17 (anonymous) @ fetch.js?hash=605b22f305af6e9c048c3ce8418e326530eff2f3:52 dynamic-import.js?hash=bdc029b69e63da4de5cd7aa028e43587376e4b70:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at dynamic-import.js?hash=bdc029b69e63da4de5cd7aa028e43587376e4b70:17 at dynamic-import.js?hash=bdc029b69e63da4de5cd7aa028e43587376e4b70:527 (anonymous) @ dynamic-import.js?hash=bdc029b69e63da4de5cd7aa028e43587376e4b70:17 (anonymous) @ dynamic-import.js?hash=bdc029b69e63da4de5cd7aa028e43587376e4b70:527 ecmascript-runtime-client.js?hash=45e5c7e13d1ce568ba0a48dab7a59237d5faf490:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at ecmascript-runtime-client.js?hash=45e5c7e13d1ce568ba0a48dab7a59237d5faf490:17 at ecmascript-runtime-client.js?hash=45e5c7e13d1ce568ba0a48dab7a59237d5faf490:1366 (anonymous) @ ecmascript-runtime-client.js?hash=45e5c7e13d1ce568ba0a48dab7a59237d5faf490:17 (anonymous) @ ecmascript-runtime-client.js?hash=45e5c7e13d1ce568ba0a48dab7a59237d5faf490:1366 base64.js?hash=21c767356350e09257a4094531173768650b2d17:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at base64.js?hash=21c767356350e09257a4094531173768650b2d17:17 at base64.js?hash=21c767356350e09257a4094531173768650b2d17:217 (anonymous) @ base64.js?hash=21c767356350e09257a4094531173768650b2d17:17 (anonymous) @ base64.js?hash=21c767356350e09257a4094531173768650b2d17:217 ejson.js?hash=53a83f5f9ccc94b5f821c94e480a606c78194e6a:17 Uncaught TypeError: Cannot read property 'Base64' of undefined at ejson.js?hash=53a83f5f9ccc94b5f821c94e480a606c78194e6a:17 at ejson.js?hash=53a83f5f9ccc94b5f821c94e480a606c78194e6a:872 (anonymous) @ ejson.js?hash=53a83f5f9ccc94b5f821c94e480a606c78194e6a:17 (anonymous) @ ejson.js?hash=53a83f5f9ccc94b5f821c94e480a606c78194e6a:872 diff-sequence.js?hash=eec312ce0e7d77a27c051d82c9ae746b0c596913:17 Uncaught TypeError: Cannot read property 'EJSON' of undefined at diff-sequence.js?hash=eec312ce0e7d77a27c051d82c9ae746b0c596913:17 at diff-sequence.js?hash=eec312ce0e7d77a27c051d82c9ae746b0c596913:321 (anonymous) @ diff-sequence.js?hash=eec312ce0e7d77a27c051d82c9ae746b0c596913:17 (anonymous) @ diff-sequence.js?hash=eec312ce0e7d77a27c051d82c9ae746b0c596913:321 geojson-utils.js?hash=55945292c277c27ae751f1845ed6c5df689e3181:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at geojson-utils.js?hash=55945292c277c27ae751f1845ed6c5df689e3181:17 at geojson-utils.js?hash=55945292c277c27ae751f1845ed6c5df689e3181:439 (anonymous) @ geojson-utils.js?hash=55945292c277c27ae751f1845ed6c5df689e3181:17 (anonymous) @ geojson-utils.js?hash=55945292c277c27ae751f1845ed6c5df689e3181:439 id-map.js?hash=557f71dcbbbe5b8eecb71d3dbbc8e468c0e5c5dc:17 Uncaught TypeError: Cannot read property 'EJSON' of undefined at id-map.js?hash=557f71dcbbbe5b8eecb71d3dbbc8e468c0e5c5dc:17 at id-map.js?hash=557f71dcbbbe5b8eecb71d3dbbc8e468c0e5c5dc:141 (anonymous) @ id-map.js?hash=557f71dcbbbe5b8eecb71d3dbbc8e468c0e5c5dc:17 (anonymous) @ id-map.js?hash=557f71dcbbbe5b8eecb71d3dbbc8e468c0e5c5dc:141 random.js?hash=bcffda7c1bd886c38a99cd9b45cc237cfe9365a7:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at random.js?hash=bcffda7c1bd886c38a99cd9b45cc237cfe9365a7:17 at random.js?hash=bcffda7c1bd886c38a99cd9b45cc237cfe9365a7:344 (anonymous) @ random.js?hash=bcffda7c1bd886c38a99cd9b45cc237cfe9365a7:17 (anonymous) @ random.js?hash=bcffda7c1bd886c38a99cd9b45cc237cfe9365a7:344 mongo-id.js?hash=aedace38bc1e5657de51f9974bc1e22a8fa52278:17 Uncaught TypeError: Cannot read property 'EJSON' of undefined at mongo-id.js?hash=aedace38bc1e5657de51f9974bc1e22a8fa52278:17 at mongo-id.js?hash=aedace38bc1e5657de51f9974bc1e22a8fa52278:164 (anonymous) @ mongo-id.js?hash=aedace38bc1e5657de51f9974bc1e22a8fa52278:17 (anonymous) @ mongo-id.js?hash=aedace38bc1e5657de51f9974bc1e22a8fa52278:164 ordered-dict.js?hash=518982567c82f3205616f5c164711ed1d8ea7ac4:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at ordered-dict.js?hash=518982567c82f3205616f5c164711ed1d8ea7ac4:17 at ordered-dict.js?hash=518982567c82f3205616f5c164711ed1d8ea7ac4:287 (anonymous) @ ordered-dict.js?hash=518982567c82f3205616f5c164711ed1d8ea7ac4:17 (anonymous) @ ordered-dict.js?hash=518982567c82f3205616f5c164711ed1d8ea7ac4:287 tracker.js?hash=725573cf35451add9ec258f882b90fd0455ebc45:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at tracker.js?hash=725573cf35451add9ec258f882b90fd0455ebc45:17 at tracker.js?hash=725573cf35451add9ec258f882b90fd0455ebc45:672 (anonymous) @ tracker.js?hash=725573cf35451add9ec258f882b90fd0455ebc45:17 (anonymous) @ tracker.js?hash=725573cf35451add9ec258f882b90fd0455ebc45:672 DevTools failed to parse SourceMap: http://crm.aprendemas.loc:3000/packages/msavin_mongol/style/Mongol.css.map minimongo.js?hash=bb17400235469027310b81f0d525d28875f12863:17 Uncaught TypeError: Cannot read property 'DiffSequence' of undefined at minimongo.js?hash=bb17400235469027310b81f0d525d28875f12863:17 at minimongo.js?hash=bb17400235469027310b81f0d525d28875f12863:4660 (anonymous) @ minimongo.js?hash=bb17400235469027310b81f0d525d28875f12863:17 (anonymous) @ minimongo.js?hash=bb17400235469027310b81f0d525d28875f12863:4660 check.js?hash=401d16440c09af1315779ddadd6e014eda8f4123:17 Uncaught TypeError: Cannot read property 'EJSON' of undefined at check.js?hash=401d16440c09af1315779ddadd6e014eda8f4123:17 at check.js?hash=401d16440c09af1315779ddadd6e014eda8f4123:637 (anonymous) @ check.js?hash=401d16440c09af1315779ddadd6e014eda8f4123:17 (anonymous) @ check.js?hash=401d16440c09af1315779ddadd6e014eda8f4123:637 retry.js?hash=7ed3fcebfdff55e930ec4a103c1a05b724a47a0d:17 Uncaught TypeError: Cannot read property 'Random' of undefined at retry.js?hash=7ed3fcebfdff55e930ec4a103c1a05b724a47a0d:17 at retry.js?hash=7ed3fcebfdff55e930ec4a103c1a05b724a47a0d:106 (anonymous) @ retry.js?hash=7ed3fcebfdff55e930ec4a103c1a05b724a47a0d:17 (anonymous) @ retry.js?hash=7ed3fcebfdff55e930ec4a103c1a05b724a47a0d:106 callback-hook.js?hash=05ddd506a68c47ac244456489f154062677c5c94:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at callback-hook.js?hash=05ddd506a68c47ac244456489f154062677c5c94:17 at callback-hook.js?hash=05ddd506a68c47ac244456489f154062677c5c94:193 (anonymous) @ callback-hook.js?hash=05ddd506a68c47ac244456489f154062677c5c94:17 (anonymous) @ callback-hook.js?hash=05ddd506a68c47ac244456489f154062677c5c94:193 ddp-common.js?hash=435aa712c8d70cee5611aac0f30ac562322abb24:17 Uncaught TypeError: Cannot read property 'check' of undefined at ddp-common.js?hash=435aa712c8d70cee5611aac0f30ac562322abb24:17 at ddp-common.js?hash=435aa712c8d70cee5611aac0f30ac562322abb24:518 (anonymous) @ ddp-common.js?hash=435aa712c8d70cee5611aac0f30ac562322abb24:17 (anonymous) @ ddp-common.js?hash=435aa712c8d70cee5611aac0f30ac562322abb24:518 reload.js?hash=ca0e06e0ee72a47ac0ca47d38becb78af6861ca6:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined at reload.js?hash=ca0e06e0ee72a47ac0ca47d38becb78af6861ca6:17 at reload.js?hash=ca0e06e0ee72a47ac0ca47d38becb78af6861ca6:256 (anonymous) @ reload.js?hash=ca0e06e0ee72a47ac0ca47d38becb78af6861ca6:17 (anonymous) @ reload.js?hash=ca0e06e0ee72a47ac0ca47d38becb78af6861ca6:256 socket-stream-client.js?hash=09504fd1375902c3710ecc38f6f0548f9279a6f0:17 Uncaught TypeError: Cannot read property 'Retry' of undefined at socket-stream-client.js?hash=09504fd1375902c3710ecc38f6f0548f9279a6f0:17 at socket-stream-client.js?hash=09504fd1375902c3710ecc38f6f0548f9279a6f0:3267 (anonymous) @ socket-stream-client.js?hash=09504fd1375902c3710ecc38f6f0548f9279a6f0:17 (anonymous) @ socket-stream-client.js?hash=09504fd1375902c3710ecc38f6f0548f9279a6f0:3267 ddp-client.js?hash=89bafa13e23a175abb386c90f25cc5b8318191a3:17 Uncaught TypeError: Cannot read property 'check' of undefined at ddp-client.js?hash=89bafa13e23a175abb386c90f25cc5b8318191a3:17 at ddp-client.js?hash=89bafa13e23a175abb386c90f25cc5b8318191a3:2183 (anonymous) @ ddp-client.js?hash=89bafa13e23a175abb386c90f25cc5b8318191a3:17 (anonymous) @ ddp-client.js?hash=89bafa13e23a175abb386c90f25cc5b8318191a3:2183 ddp.js?hash=fcd820591d6158c4373c9acaa2e16c1a15e1480b:14 Uncaught TypeError: Cannot read property 'DDP' of undefined at ddp.js?hash=fcd820591d6158c4373c9acaa2e16c1a15e1480b:14 at ddp.js?hash=fcd820591d6158c4373c9acaa2e16c1a15e1480b:23 (anonymous) @ ddp.js?hash=fcd820591d6158c4373c9acaa2e16c1a15e1480b:14 (anonymous) @ ddp.js?hash=fcd820591d6158c4373c9acaa2e16c1a15e1480b:23 allow-deny.js?hash=b8f691586b185f16482495af6af70d6446753d30:17 Uncaught TypeError: Cannot read property 'LocalCollection' of undefined at allow-deny.js?hash=b8f691586b185f16482495af6af70d6446753d30:17 at allow-deny.js?hash=b8f691586b185f16482495af6af70d6446753d30:556 (anonymous) @ allow-deny.js?hash=b8f691586b185f16482495af6af70d6446753d30:17 (anonymous) @ allow-deny.js?hash=b8f691586b185f16482495af6af70d6446753d30:556 mongo.js?hash=7250a2382fe7da4123f02f62e93ed5f8d306ed33:17 Uncaught TypeError: Cannot read property 'AllowDeny' of undefined at mongo.js?hash=7250a2382fe7da4123f02f62e93ed5f8d306ed33:17 at mongo.js?hash=7250a2382fe7da4123f02f62e93ed5f8d306ed33:879

yjaaidi commented 5 years ago

Oh! I guess I know where it comes from. It seems similar to these issues: https://github.com/InfomediaLtd/angular2-materialize/issues/381 https://github.com/SebastianM/angular-google-maps/issues/1058

yjaaidi commented 5 years ago

I fixed the package.json entries to use the UMD format by default here: https://github.com/wishtack/wishtack-steroids/commit/78c79627fa957c64bf5187c552a7ff43a06d7a27

Could you please try to upgrade to @wishtack/reactive-component-loader@0.2.4 and let me know if it works for you?

Thank you in advance.

jbx-jhidalgo commented 5 years ago

I have updated the package to @ wishtack / reactive-component-loader @ 0.2.4 but the same errors keep appearing

yjaaidi commented 5 years ago

Is there a way you could provide a repository reproducing that same error? Thanks.

jbx-jhidalgo commented 5 years ago

Sorry for the delay. First I want to thank you for your help. I have replicated the same error in a clean project based on (https://github.com/Urigo/angular-meteor) with the same packages and the same tsconfig that I use in my real project. To run the project you must have installed meteor. Launch the same error that I told you.

https://github.com/jbx-jhidalgo/lazyloadtest

yjaaidi commented 5 years ago

Hi @jbx-jhidalgo,

Thank you for the repo. I was able to reproduce the issue and it seems to be related to the usage of ng-dynamic-component's IoService: https://github.com/wishtack/wishtack-steroids/blob/9128971d1b7d25932fde7985023fe09eae944126/packages/reactive-component-loader/src/lib/lazy/lazy.directive.ts#L15

This file ng-dynamic-component/dynamic/io.service is bundled as is even though it's using ES Module.

The two ways of solving this that I can think about right now are as follows:

  1. Make ng-dynamic-component expose IoService here https://github.com/gund/ng-dynamic-component/blob/master/src/dynamic/index.ts.
  2. Using Meteor with Angular CLI like this: https://medium.com/the-guild/angular-cli-meteor-no-more-eject-webpack-configuration-4e718aa855b6. Would that make sense for you?
jbx-jhidalgo commented 5 years ago

Hello, unfortunately the option to use Meteor with Angular CLI in our project is not possible. There would be some possibility that you would modify your library according to what the issue of @jbx-alex ?

yjaaidi commented 5 years ago

Just updated the issue on ng-dynamic-component https://github.com/gund/ng-dynamic-component/issues/225#issuecomment-483772563

Sorry if it feels like administrative ping pong 🏓 here but I am really trying to figure some quick solution for everyone.

jbx-jhidalgo commented 5 years ago

Thank you very much for all the work you are doing

yjaaidi commented 5 years ago

I just removed wtLazy structural directive which was causing trouble. Hope it helps.

jbx-alex commented 5 years ago

Hi @yjaaidi,

First, thank you very much for continuing to investigate to solve the problem. The problem has already been solved when we compiled our project, but now when trying to execute your example https://medium.com/wishtack/angular-lazy-loading-without-router-471166580c86 a new error has arisen:

TypeError: path.split is not a function modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:39451 ERROR TypeError: path.split is not a function at SystemJsNgModuleLoader.loadAndCompile (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:42082) at SystemJsNgModuleLoader.load (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:42078) at ReactiveComponentLoader.<anonymous> (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196784) at step (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196627) at Object.next (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196576) at modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196569 at new ZoneAwarePromise (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:8668) at __awaiter (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196555) at ReactiveComponentLoader._getModuleFactory (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196782) at ReactiveComponentLoader.<anonymous> (modules.js?hash=f8f60dbadf6e77f868577a489b513c457178fcc3:196716)

I guess it will be an error for having done the project with angular-meteor

Anyway, thank you very much for all the help provided. Regards.

jbx-alex commented 5 years ago

Hi @yjaaidi,

It was my fault when it came to building the loadChildren string.

Thank you so much for everything

yjaaidi commented 5 years ago

Thank you for your feedback 😊